2011-01-15 2 views
3

У меня есть следующий список с неупорядоченным списком с id # sortable1, чего я хочу достичь, когда щелкнут элемент li с помощью < ul id = "sortable2"> должно произойти событие onclick и предупредить id из элемента li, который был нажат. У меня есть один элемент, также внутри неупорядоченного списка, которые не должны быть интерактивными с классом = «emptyMessage»jquery on click event не работает над элементами списка в неупорядоченном списке

я застрял и не знаю, как поступить

До сих пор я

<ul id="sortable1" class="connectedSortable ui-sortable"> 
<li class="ui-state-default" id="1">Name1</li> 
<li class="ui-state-default" id="2">Name2</li> 
<li class="ui-state-default" id="3">Name3</li> 
<li class="ui-state-default" id="4">Name4</li> 
<li class="ui-state-default" id="5">Name5</li> 
<li style="display: list-item;" class="emptyMessage">No more contacts available</li></ul> 

Мои Код JQUERY

$("#sortable1 li").click(function() { 
      alert('Clicked list.'+$(this).value); 
     }); 

ответ

11

Это следует сделать это:

$("#sortable1 li").not('.emptyMessage').click(function() { 
     alert('Clicked list. ' + this.id); 
}); 

Демо: http://www.jsfiddle.net/gztRq/2/

+0

Да,' .text() 'лучший выбор здесь. – Skilldrick

+0

Но он спрашивал идентификатор в вопросе :) –

0

В вашем JavaScript есть синтаксическая ошибка. Оно должно быть:

$("#sortable1 li").click(function() { 
    alert("Clicked list." + $(this).value); 
}); 

Кроме того, я думаю, что вы имеете в виду $(this).html(), не $(this).value - <li> s не имеют значения (и это будет .val() на объект JQuery).

Here's a working version.

+0

'.val()' также не будет работать на узлах 'li'. – jAndy

+0

@jAndy - да, я просто заметил это :) – Skilldrick

+0

да, я имел в виду val вместо val – Roland

0

Может быть неправильно селектор? Вот мой код (отлично работает):

<html> 
    <head> 
     <title>MooExample</title> 
     <script type="text/javascript" src="jquery.js"></script> 
     <script type="text/javascript"> 
      $(document).ready(function() { 
       $("#sortable1 > li").click(function() { 
        alert($(this).html()); 
       }); 
      }); 
     </script> 
    </head> 

    <body> 
     <ul id="sortable1" class="connectedSortable ui-sortable"> 
      <li class="ui-state-default" id="1">Name1</li> 
      <li class="ui-state-default" id="2">Name2</li> 
      <li class="ui-state-default" id="3">Name3</li> 
      <li class="ui-state-default" id="4">Name4</li> 
      <li class="ui-state-default" id="5">Name5</li> 
     </ul> 
    </body> 
</html> 

UPD: я извиняюсь, я думаю, что <li> элементов не имеют VAL() свойства =)

+0

У меня было много синтаксических ошибок. lol – Roland

+0

@shyboyycha - Вам также не хватает класса emptyMessage. – jmort253

2
$("#sortable1 > li.ui-state-default").click(function() { 
    alert("Clicked list " + $(this).attr("id")); 
}); 
0

использовать это, чтобы быть более конкретным при выборе

$(document).ready(function() { 
    $("ul#sortable1 li").click(function() { 
    alert("Clicked list." + $(this).text()); 
}); 
});