javascript - Why jquery selector select element from old value instead of new value

Question

Whenever I select element with jquery with selector it select element from old value instead of new value if I get value of selected element it give me new value. My code is here http://jsfiddle.net/HUdkN/3/.

Here I have use Australia value for selecting element ,even if I change value. It will select element. Why ??? could somebody explain it.

HTML CODE

    <input type="text" class="lbl" value="Australia" />
    <div id="result"></div>
    <br />
    <br/>
    <input type="button" value="check" id="check_btn">

JAVASCRIPT CODE

    function check_fnc() {
        jQuery('input').removeClass('error');
       jQuery('input[value="Australia"]').each(function () {
           $(this).addClass('error');
            $('#result').html(this.value);
       });
   }

   $('#check_btn').click(function () {
      check_fnc();
   })

Answer 1

这是因为Attribute Equals 选择器例如[value="Australia"]匹配实际的 HTML 属性，而不是当前的 DOM 属性，并且valueHTML 属性将始终包含元素的原始值。

要匹配当前值，您可以使用filter()代替：

$("input").filter(function() {
    return this.value == "Australia";
}).each(function() {
    $(this).addClass("error");
    $("#result").html(this.value);
});

Answer 2

对于这种情况，您不需要使用任何过滤器。只需删除引号，即使用

  $("input[value=Australia]") .each(...)

Answer 3

你用这个

jQuery('input[value="Australia"]') 
// (") should be remove after (value=) and after Australia

你也可以使用它

function check_fnc() {
        jQuery('input').removeClass('error');
        //    I eddited here
        jQuery('input[value=Australia]').each(function () {
           $(this).addClass('error');
            $('#result').html(this.value);
       });
   }

希望这会奏效..谢谢