无法应用javascript的问题取决于URL参数是否是

Question

有一个下拉列表(select选项)来选择是否为is_recruiting，还有一个用于选择“总计”或“句点”的无线选项，以及“from_date”和“to_date”的输入标记来设置选择“句号”时的日期。

当无线电选项居中并选择“总计”时，将禁止输入日期输入标记，并且可以选择“招聘”选项。相反，如果选择“期间”，则会阻止招聘选项，并且可以设置期间(from_date& to_date)。

<form action="/chart" method="GET">
    <select name="is_recruiting" id="is_recruiting" class="ml-4">
        <option value="A" {% if is_recruiting == "A" %} selected {% endif %}>A</option>
        <option value="B" {% if is_recruiting == "B" %} selected {% endif %}>B</option>
        <option value="ALL" {% if is_recruiting == "ALL" %} selected {% endif %}>ALL</option>
    </select>
    <div class="radio" style="display: inline">
      <label><input type="radio" name="optionRadios" value="total" {% if option_radio != 'period' %} checked {% endif %}/> Total </label>
    </div>
    <div class="radio" style="display: inline">
      <label><input type="radio" name="optionRadios" value="period" {% if option_radio == 'period' %} checked {% endif %}/> Period : </label>
        <input autocomplete="off" class="datepicker" name="from_date" id="fromDate" value={{from_date|default_if_none:''}}>
        <label> ~ </label>
        <input autocomplete="off" class="datepicker" name="to_date" id="toDate" value={{to_date|default_if_none:''}}>
    </div>
    <button class="btn btn-primary btn-xs mb-1" type="submit">Submit</button>
</form>


<script>
    $('input[type=radio][name=optionRadios]').on('click',function () {
    var chkValue = $('input[type=radio][name=optionRadios]:checked').val();
    var recruitingSelect = document.getElementById("is_recruiting");

    if(chkValue == 'total'){
        $( '#fromDate' ).attr('disabled', 'disabled').val('');
        $( '#toDate' ).attr('disabled', 'disabled').val('');

    }
    elif(chkValue == 'total'){
        $( '#fromDate' ).removeAttr('disabled');
        $( '#toDate' ).removeAttr('disabled');
    }

    if(chkValue == 'period'){
        recruitingSelect.disabled = true;
    }
    else {
        recruitingSelect.disabled = false;
    }
});
</script>

如果url中没有is_recruiting或optionRadios、from_date、to_date参数，则上述JavaScript代码正常工作，但如果您选择一个选项并提交一次并将参数包含在url中，则不会应用JavaScript。怎么了？

http://127.0.0.1:8000/chart/ -> JavaScript应用http://127.0.0.1:8000/chart/?is_recruiting=A&optionRadios=total -> JavaScript未应用

Answer 1

您的JavaScript很可能会中断，因为elif不存在于Javascript中。使用else if(...)代替。另外，您似乎在else if逻辑中有一个错误:您正在第二次检查chkValue == 'total' (在第一个if之后)。我猜正确的条件是chkValue != 'total'。

此外，由于ES6，建议您在===和!==中使用类型安全检查。当比较操作双方时，这些操作符将检查参数的数据类型。