Как правильно использовать href = "# someID"? - PullRequest
Новая
       15

Как правильно использовать href = "# someID"?

0 голосов
/ 07 сентября 2011

В принципе, я хочу иметь список ссылок, где каждая ссылка будет отображать div.У меня все настроено так, что это работает, но я просто не знаю, какие события запускаются и в каком порядке.Я хочу добавить функциональность, чтобы при показе одного из этих элементов div запускался JavaScript.Но пока что при использовании такого кода, как этот:

<a href="#div1" onclick="some_script()" />

вызывает some_script () до того, как он действительно покажет div.Это бесполезно для меня, так как я пытаюсь сфокусировать определенное поле ввода после показа div.

Может кто-нибудь сказать мне, какие события jquery запускаются, или события jquery, которые я могу использоватьчто я могу запустить some_script () после того, как div показывается пользователю?

Ответы [ 2 ]

2 голосов
/ 07 сентября 2011

Вы можете использовать что-то вроде этого 

$(document).ready(function(){
    $('a').click(function(){ //attaches click event to all 'a' elements on page
        var div = $(this).attr("href").substr(1); //gets the div
        $(div).show(); //show the div
    });
});

Эта ссылка поможет вам начать работу с jQuery. http://docs.jquery.com/Main_Page

1 голос
/ 07 сентября 2011

Если я правильно понял ваши требования:

HTML 

<p><a href="#div_one" class="trigger">1st div</a></p>
<p><a href="#div_two" class="trigger">2nd div</a></p>
<div id="div_one">
    Some content
    <input type="text" name="input1" class="input">
</div>
<div id="div_two">
    Some more content
     <input type="text" name="input2" class="input">
</div>

CSS 

div {
    border: 2px solid green;
    background-color: lightgreen;
    color: black;
    display: none;
    margin: 10px;
    padding: 5px;
}

JavaScript 

$('.trigger').click(function(e) {
    e.preventDefault();
    var target_div = $(this).attr('href');
    $(target_div).toggle();
    $(target_div).find('.input').focus();
});

jsFiddle demo: http://jsfiddle.net/byuPL/

...