прокрутка до местоположения на div Id с помощью jquery?

Question

прокрутка до местоположения на div Id с помощью jquery?

0

Я пытаюсь перейти к div на основе его после захвата идентификатора из Url.

URL-адрес подобен ниже первого, когда пользователь перемещается на эту страницу

http://localhost:6447/products/all-products#productId2

Здесь # productId2 - это div id на странице, на которую мне нужно прокручивать загрузку страницы

Я показываю продукты в listview с пейджингом

<ItemTemplate>
                <tr>
                    <td>
                        <div id='#productId<%#Eval("PId")%>'>
                            <a class="ProdcutText">
                                <%#Eval("PName")%></a>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td>
                        <div class="PriceText">
                            -<a class="PPrice"><%#Eval("Price")%></a></div>
                    </td>
                </tr>
                <tr>
                    <td>
                        <div class="PDesc">
                            <asp:Label ID="lblDesc" runat="server" Text='<%#Eval("PrdocutDescription")%>'> </asp:Label>
                        </div>
                    </td>
                </tr>
            </ItemTemplate>

и на странице содержимого, которую я пробовал ниже, но, похоже, не работает.

<asp:Content ID="HeadContent" ContentPlaceHolderID="MasterHeadContentHolder" runat="server">
<script type="text/javascript" src="/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('html,body').animate({
            scrollTop: $("#productId6").offset().top
        }, 2000);
    });
</script>

Что не так? и после подкачки URL-адрес изменяется, и я получаю ошибку неопределенной и нулевой ошибки.

http://localhost:6447/products/all-products?list=1

Abhishek Ranjan 28 нояб. 2013, в 20:37

Источник

0

Это проблема сервера, ASP добавляет строку запроса для подкачки страниц, но не добавляет хэш местоположения, так что все прошло!
adeneo 28 нояб. 2013, в 19:02
0

@adeneo: Да, я знаю. пошло так, как справиться с этой ситуацией, когда она нулевая.
Abhishek Ranjan 28 нояб. 2013, в 19:18

Теги:

jquery

asp.net

3 ответа

Ещё вопросы

Это проблема сервера, ASP добавляет строку запроса для подкачки страниц, но не добавляет хэш местоположения, так что все прошло!
@adeneo: Да, я знаю. пошло так, как справиться с этой ситуацией, когда она нулевая.

Bhaskar Bhatt · Answer 1 · 2013-11-28T17-46-00.000Z

0

ясно, что ваш html должен генерировать, как показано ниже:

<div id="productId2">
   Proiduct details
</div>

Bhaskar Bhatt 28 нояб. 2013, в 17:46

0

Благодарю. Это просто написано # также в Id.Можете ли вы мне подсказать, как получить значение из URL и применить его для передачи значения в jquery для прокрутки?
Abhishek Ranjan 28 нояб. 2013, в 19:06
0

Я получаю сообщение об ошибке «Ошибка времени выполнения JavaScript: невозможно получить свойство top из неопределенной или нулевой ссылки», когда я перемещаюсь с использованием подкачки, так как #productId недоступен на следующей странице. Как справиться с этим?
Abhishek Ranjan 28 нояб. 2013, в 19:08

Bhaskar Bhatt · Answer 2 · 2013-11-28T17-31-00.000Z

пожалуйста, используйте код ниже, когда вы указываете имя файла как test.html, тогда вы набираете url test.html # div1, он будет прокручиваться до div 1 test.html # div2, он будет прокручиваться до div 2

<html>
<body>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>


<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<div id="div1">div</div>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>

<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>

<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<div id="div2">Div start</div>
</body>
</html>

только этот HTML-код. Нет необходимости в JS или любой другой материал.
извиняюсь. но я не поняла и как решить «Ошибка времени выполнения JavaScript: невозможно получить свойство« top »с неопределенной или нулевой ссылкой»?
здесь нет необходимости в JavaScript, вы можете сделать только чистый HTML.

Costel · Answer 3 · 2013-11-28T16-31-00.000Z

Попробуйте этот код Javascript:

    var $target = $( location.hash);
    var pos = Math.max( 0, $target.offset().top);
    var $view = browser.indexOf('WebKit') < 0 ? $('html') : $(document.body);
    $view.animate({'scrollTop': pos});

Первая строка получает productId из URL-адреса, например # productId2. Затем он находит элемент с этим идентификатором, # является селектором jQuery для ID. Вторая строка вычисляет положение этого элемента по странице (количество прокрутки). Третья строка определяет, что нужно прокручивать, HTML (для Chrome & Safari) или BODY. В последней строке выполняется плавная прокрутка.

Благодарю. Но несколько раз я получал сообщение об ошибке «Ошибка времени выполнения JavaScript: невозможно получить свойство« top »из неопределенной или нулевой ссылки». а также он прыгает на локацию и не выполняет анимацию.
Чтобы избежать ошибки, просто добавьте if ($ target.length) {после первой строки и закройте ее с помощью} после последней.