Почему тег не создает интерактивную ссылку?

#javascript #jquery #html

#javascript #jquery #HTML

Вопрос:

У меня есть ссылка, которая выглядит следующим образом:

 <p class="half_text"><?php echo $upvotes; ?> <strong>
<a id="vote_up" style="color: #295B7B; font-weight:bold;" href="">Vote Up</a>
</strong> | <?php echo $downvotes; ?> <strong>
<a id="vote_down" style="color: #295B7B; font-weight:bold;" href="">Vote Down</a>    
</strong></p>

и некоторый код jQuery, который я пытаюсь вызвать.

 <script type="text/javascript">
$('#vote_up').click(function() 
{
    alert("up");
});
</script>

Но по какой-то причине предупреждение не срабатывает при нажатии ссылок «голосовать вверх» или «вниз». Есть идеи, что я делаю не так?

Вы можете убедиться в этом сами здесь: http://www.problemio.com

1. Для начала измените ваши vote_up и vote_down на классы. У вас должен быть только один экземпляр идентификатора на странице, и я предполагаю, что jquery не использует тот, который вам нужен.

2. Среди других упомянутых проблем (пока все они выглядят актуальными) вам также необходимо return false из обработчика click событий запретить навигацию по странице.

Ответ №1:

Вам нужно поместить свой код внутри .ready() обработчика:

 $(document).ready(function() {
    $('#vote_up').click(function() 
    {
        alert("up");

        //Return false to prevent page navigation
        return false;
    });
});

Взгляните на .ready() документы: http://api.jquery.com/ready /

Вот рабочий jsFiddle .

1. Небольшое дополнение, но я бы установил href=»#», добавил «e» в качестве аргумента для анонимной функции, а затем вызвал e.preventDefault() . Выполнение этого устраняет необходимость return false в функции.

Ответ №2:

Оберните свой код в .ready() обработчик. Ярлык $(function(){...}) :

 $(function(){
   $('#vote_up').click(function() {
      alert("up");
   });
})

эквивалентно $(document).ready(function(){....}) .

Ответ №3:

Не уверен, что это необходимо, но попробуйте поместить a # в href атрибут.

Кроме того, вы используете id атрибуты для своих ссылок, когда на странице более одного из них, вы должны использовать class вместо этого.

1. href Атрибут не нужен: w3.org/TR/html401/struct/links.html#h-12.2

2. @davin на самом деле без атрибута href текст не превращался в ссылку. Знаете ли вы, почему это происходит?

3. @Genadinik, href это местоположение. Без указания местоположения, на которое можно указать, он на самом деле нигде не ссылается, поэтому браузер не отображает его как «ссылку» как таковую. Хотя это только для аспектов стиля, стандарт по-прежнему считает его допустимой разметкой.

Ответ №4:

Предполагается id , что атрибут должен быть уникальным для всего документа. Если вы хотите, чтобы он применялся к нескольким элементам, рассмотрите возможность использования a class вместо этого.

Ответ №5:

Не уверен, что это вызывает вашу проблему, но у вас есть дубликаты идентификаторов на вашей странице.

Попробуйте изменить ‘vote_up’ и ‘vote_down’ на классы.