Основная помощь jQuery

Question

Я уверен, что я потеряю некоторые репутационные очки для этого, потому что это такой основной вопрос, но я не могу понять, что я делаю неправильно с селекторами jQuery, используя «#» для выберите по id.

дал этот элемент в моем документе:

<%= Html.CheckBox("IsAlwaysValid", true, 
        new { onchange = "showHideValidSetList()", id = "IsAlwaysValidCheckBox" })%> 

(который выводит следующую разметку:

<input checked="checked" id="IsAlwaysValidCheckBox" name="IsAlwaysValid" onchange="showHideValidSetList()" type="checkbox" value="true" /><input name="IsAlwaysValid" type="hidden" value="false" /> 

)

Затем эту функцию с помощью селектора JQuery:

<script type="text/javascript"> 
    function showHideValidSetList() { 
     if ($("#IsAlwaysValidCheckBox").checked) { 
      alert("IsAlwaysValidCheckBox is checked"); 
      return; 
     } 
     else { 
      alert("IsAlwaysValidCheckBox is NOT checked"); 
      return; 
     } 
    } 
</script> 

должен быть в точности эквивалентен этому с использованием javascript DOM:

<script type="text/javascript"> 
    function showHideValidSetList() { 
     if (document.getElementById("IsAlwaysValidCheckBox").checked) { 
      alert("IsAlwaysValidCheckBox is checked"); 
      return; 
     } 
     else { 
      alert("IsAlwaysValidCheckBox is NOT checked"); 
      return; 
     } 
    } 
</script> 

0? Но версия javascript работает так, как ожидалось, в то время как jQuery всегда берет ветку «else», показывая, что она действительно не смотрит на состояние флажка.

Что я делаю неправильно?

Спасибо за подшипник со мной.

Answer 1

Используйте это:

if ($(checkBoxControl).attr("checked")) { 

вместо этого:

if ($("#IsAlwaysValidCheckBox").checked) { 

Хотя это выглядит как JQuery селекторы возвращают элементы DOM (например, флажки), они действительно возвращают объект JQuery, который не имеет метод под названием checked. Вы можете увидеть это наиболее явно в исходном коде несжатого Jquery (от the current release, version 1.3.2):

jQuery.fn = jQuery.prototype = { 
    init: function(selector, context) { 
     // ... 
     // Handle $(DOMElement) 
     if (selector.nodeType) { 
      this[0] = selector; 
      this.length = 1; 
      this.context = selector; 
      return this; 
     } 
     // ... 
    } 
} 

Многие из интересных методов JQuery (как живой, атр, HTML и т.д.) работает на this.context, который указан или переопределен когда вы применяете селектор.

Answer 2

попробовать это:

<script type="text/javascript"> 
    function showHideValidSetList() { 
     if ($("#IsAlwaysValidCheckBox").val()) { 
      alert("IsAlwaysValidCheckBox is checked"); 
      return; 
     } 
     else { 
      alert("IsAlwaysValidCheckBox is NOT checked"); 
      return; 
     } 
    } 
</script> 

метод val является своего рода «кросс-элементного» способ проверки значения ... является ли это текстовое поле, выберите список, или флажок ... Вы можете использовать .val(), чтобы получить/установить значение его :-)

Answer 3

$("#IsAlwaysValidCheckBox").checked 

неверно, как $("#IsAlwaysValidCheckBox") возвращает объект JQuery, а не элемент. Объект jQuery не имеет свойства checked, поэтому он вводит else.

вы хотите:

$("#IsAlwaysValidCheckBox").val() 

или:

$("#IsAlwaysValidCheckBox:checked").length > 0 

или:

$("#IsAlwaysValidCheckBox").attr("checked") === "checked" 

или:

$("#IsAlwaysValidCheckBox")[0].checked 

или:

$("#IsAlwaysValidCheckBox").get(0).checked 

Answer 4

ли вы попробовать использовать

if ($("#IsAlwaysValidCheckBox").attr("checked")) { 

Answer 5

Вы должны использовать это:

$("#IsAlwaysValidCheckBox").attr("checked") 

, чтобы определить, проверяется ли флажок или нет.

Answer 6

Еще один способ сделать простую вещь:

$('#IsAlwaysValidCheckBox:checked').length

Селектор: проверил JQuery специфичны для возврата проверяемого элемента. Длина проверяет, есть ли какие-либо элементы.

Много способов сделать то же самое.