If-else条件在Javascript中无法正确执行

时间:2015-09-03 12:33:50

标签: javascript jquery

我希望这个问题不是太愚蠢,但我坚持下去,并尝试过可能的事情。我在表格行中有一个下拉列表,我正在动态添加,我将更改事件与下拉列表相关联。我在这里有以下代码:

$(document).on("change", $('tr').find('select'), function(){

    if ($(this).val() == 0){
        $('#items_selected').text(1);
        alert("2nd time wrong");
    }else{
        alert("2nd time right");
        $('#items_selected').text(parseInt($('#items_selected').text()) + parseInt($(this).val()));
    }
});

现在,有一个复选框,当检查时会导致下拉列表(以前禁用)变为启用。这会正确触发更改事件,在上面的代码中执行if条件。但是当我将下拉列表中的值从默认值0更改为其他内容时,事件会触发,但同样会执行if条件,而不是其他应该执行的操作。我的事件类型(change)有问题,或者我的数据类型(字符串/数字)搞砸了,还是其他什么?我尝试了parseInt()和其他事情,但他们没有工作。有人可以帮忙吗?

2 个答案:

答案 0 :(得分:1)

您应该检查选择的文字值,例如$(this).find("option:selected").val()

以下代码有效:

$(document).on("change", $('tr').find('select'), function(){    
    if ($(this).find("option:selected").val() == 0){   
        alert($(this).find("option:selected").val());
    }else{
        alert($(this).find("option:selected").val());         
    }
});

工作FIDDLE

答案 1 :(得分:0)

在目前的代码中,您在on上致电$(document)。因此,在事件处理程序中,this将是document(即使您实际上正在查看下拉列表中发生的事件)。

您可以尝试这样的事情:



$("#the-select").on("change", function(){
    // good practice: always use "==="
    if ($(this).val() === "0"){
        $('#items_selected').text(1);
        alert("2nd time wrong");
    }else{
        alert("2nd time right");
        $('#items_selected').text(parseInt($('#items_selected').text()) + parseInt($(this).val()));
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="the-select">
  <option>0</option>
  <option>1</option>
  <option>2</option>
  <option>3</option>
</select>

<div id="items_selected">0</div>
&#13;
&#13;
&#13;

如果您绝对想在on上致电$(document)(虽然我无法理解您的意愿),请记住,this不会成为你的下拉菜单。将它放在较高范围的变量中,在处理程序中重新选择它,或者将bind处理程序放到下拉列表中。