Question

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

$(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()和其他事情，但他们没有工作。有人可以帮忙吗？

Answer 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

Answer 2

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

您可以尝试这样的事情：

＆＃13;

$("#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()));
    }
});

＆＃13;

<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;

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

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

2 个答案: