Question

我有一个问题，我无法理解为什么会发生这种情况。我有一个公社，如果是，但是正在执行if和else的一部分，这只在第一次执行时发生。

HTML code：

<div class="span3 options-search">
  <select id="condition[0]" name="condition[0]" onchange="checkCriterial(this.value,0);">                                                     
    <option value="2">Id</option>
    <option value="3">private</option>
    <option value="11">author</option>
    <option value="1">Date</option>
    <option value="4">externalId</option>
    <option value="5">Email</option>
    <option value="9">string</option>
    <option value="10">Date</option>
    <option value="6">numeric</option>
    <option selected="selected" value="7">true-false</option>
    <option value="8">numeric</option>
  </select>
</div>
<div class="span1 criterial-search-0">
  <select class="span1" id="criterial[0]" name="criterial[0]">
    <option value="1">=</option>                     
  </select>
</div>
<div class="span3 condition-quicksearch-0">
  <select class="span2 search-value-0" id="valuevar[0]" name="valuevar[0]" ><option value="false">False</option> <option value="true">True</option></select>
</div>

JS代码：

checkCriterial = function (condition, id) {
    if (condition == 1 || condition == 10) {
        $('.search-value-' + id).attr('placeholder', '31/12/2015').addClass("datepicker").attr("data-date-format", "dd/mm/yyyy").attr("data-link-format", "yyyy-mm-dd");
        $(".criterial-search-" + id).html('<select class="span1" id="criterial[' + id + ']" name="criterial[' + id + ']"><option value="1">=</option><option value="2">>=</option><option value="3"><=</option></select>');
    } else if (condition == 7) {
        $('.condition-quicksearch-' + id).html('<select class="span2 search-value-' + id + '" id="valuevar[' + id + ']" name="valuevar[' + id + ']" ><option value="false">False</option> <option value="true">True</option></select>');
        $(".criterial-search-" + id).html('<select class="span1" id="criterial[' + id + ']" name="criterial[' + id + ']"><option value="1">=</option></select>');
    } else {
        $('.condition-quicksearch-' + id).html('<input type="text" class="span3 search-value-' + id + ' search" id="valuevar[' + id + ']" name="valuevar[' + id + ']" />');
        $(".criterial-search-" + id).html('<select class="span1" id="criterial[' + id + ']" name="criterial[' + id + ']"><option value="1">=</option></select>'); //<- this is also executed
    }
};

我为https://jsfiddle.net/wr5p4xf7/

创建了一个jsfiddle

如果选择date选项，它将执行if语句和else的第二行。

我检查的第一件事是括号，看起来很好。

任何想法？

全部谢谢。

Answer 1

这不起作用，因为您的 search-value-0 字段初始化为select元素，您需要删除当前的 search-value-0 ，创建一个新的元素输入，在此插入datepicker类之后就是元素。

我改变了你的小提琴，在第一个条件内创建输入，现在它正在工作。

 if (condition == 1 || condition == 10) {
        $('.condition-quicksearch-' + id).html('<input type="text" class="span3 search-value-' + id + ' search" id="valuevar[' + id + ']" name="valuevar[' + id + ']" />');
            $('.search-value-' + id).attr('placeholder', '31/12/2015').addClass("datepicker").attr("data-date-format", "dd/mm/yyyy").attr("data-link-format", "yyyy-mm-dd");
            $(".criterial-search-" + id).html('<select class="span1" id="criterial[' + id + ']" name="criterial[' + id + ']"><option value="1">=</option><option value="2">>=</option><option value="3"><=</option></select>');
        }

https://jsfiddle.net/wr5p4xf7/8/

Answer 2

在我的浏览器（Linux Ubuntu，Chrome 45）中，每个循环都按预期处理：

checkCriterial()：
- condition的值取决于在选择框中选择的选项。
- 当if (condition == 1 || condition == 10) { [...] }为1或10时，它会处理condition。
- 当if (condition == 7) { [...] }为7时，它处理condition。
- 当else { [...] }不是1,7或10时，它处理condition。

请参阅this modified Fiddle，我在其中提醒一些调试信息。

如果您希望console.log进行调试而不是window alert，请尝试使用this Fiddle。

似乎问题是，当您的条件为1或10时，您忘记用输入框替换您的select语句。

您为else条件正确执行了此操作，但似乎忘记了if (condition == 1 || condition == 10) { [...] }这样做。

Answer 3

在你的jsfiddle中，只有if / else结构的第一个块正在执行。要看到这个：

使用chrome访问你的jsfiddle。
点击F12打开开发工具。
在开发工具菜单栏中选择来源
在源边栏中显示扩展fiddle.jshell.net，然后是wr5p4xf7并选择索引。
在已打开的（索引）源的第51行放置一个断点。
在小提琴中选择日期。
使用调试器控件逐步执行执行路径（例如F10到步骤）。

Javascript如果正在执行if和else的一部分

3 个答案: