0

所以我有 3 个选择框和一个提交按钮。如果在任何选择框中未选择任何值，则单击提交按钮时不会发生任何事情。如果已在所有 3 个选择框中选择了值，则单击提交按钮会延迟 2 秒刷新页面。

这是我到目前为止不起作用的东西：

HTML

<select class="select1" name="select1">
<option value="0">-- Please Select --</option>
<option value="5">Blue</option>
<option value="6">Green</option>
<option value="7">Red</option>
</select>

<select class="select2" name="select2">
<option value="0">-- Please Select --</option>
<option value="5">big</option>
<option value="6">small</option>
<option value="7">medium</option>
</select>

<select class="select3" name="select3">
<option value="0">-- Please Select --</option>
<option value="5">1</option>
<option value="6">2</option>
<option value="7">3</option>
</select>


<input type="submit" value="something1" name="something2" onclick="refresh(2000)" class="something3" id="something4">

JS

if($(".select1" && ".select2" && ".select3")).value !== "0") {
    function refresh (timeoutPeriod){refresh = setTimeout(function(){window.location.reload(true);},timeoutPeriod);}
}

但是我在这里也遇到的问题是，如果语句不正确（onload 等），则不会定义刷新。我已经环顾了几个小时，并没有真正找到太多，或者我可能没有做正确的事情。任何帮助或指导将不胜感激。

4

3 回答 3

1

您当前的代码存在一些问题：

  • 错误使用 jQuery 选择器$(".select1" && ".select2"..
    • jQuery 选择器使用类似于选择器文本的 CSS 来收集多个规则
    • 因为您要检查的是三个不同的值，所以您必须检查每一个。
  • 功能的范围和位置refresh()是模棱两可且未调用的。
  • jQuery 没有.value属性，您必须通过.val()jQuery 对象调用它。
<script>
function refresh() {
    if( $(".select1 option:selected").val() !== "0" && 
        $(".select2 option:selected").val() !== "0" && 
        $(".select3 option:selected").val() !== "0" ) {

        setTimeOut(function(){ 
           window.location.reload();
        }, 2000 );
    }
}
</script>
于 2013-10-19T00:03:28.977 回答
0

你错在一个地方，

if($(".select1" && ".select2" && ".select3")).value !== "0") {
 function refresh (timeoutPeriod) {
  refresh = setTimeout(function() {
   window.location.reload(true);
  },timeoutPeriod);
 }
}

这行不通。在计算机语言中，您需要检查一个条件，然后再转到另一个条件。

如果所有运算符都是布尔值，则您使用的条件将起作用，例如

if((bool1 && bool2 && bool3) {
  /* code executes if all three bools are true!
   */
}

所以你需要的是，这个：

if($('.select1'.val() != '0' && 
     '.select2'.val() != '0' && 
     '.select3'.val() != 0)) {
 function refresh (timeoutPeriod) {
  refresh = setTimeout(function() { 
    window.location.reload(true);
  }, timeoutPeriod);
 }
}

这样，您将首先检查 select1 然后 select2 然后最后一个，如果它们都没有0值。然后该功能将继续。否则它将保持原样。

这是算法的小提琴：http: //jsfiddle.net/afzaal_ahmad_zeeshan/tSDKN/2/

对不起，我祈祷的时间不多了！所以你可以从 fiddle 获得基本代码 :) 我已经解释了 select 是如何在那里工作的。

祝兄弟好运。

于 2013-10-19T00:39:14.177 回答
0

您想要更优雅的解决方案吗？

HTML：

<select class="select1" onchange="handleChange($(this))">
<option value="0">-- Please Select --</option>
<option value="5">Blue</option>
<option value="6">Green</option>
<option value="7">Red</option>
</select>

<select class="select2" onchange="handleChange($(this))">
<option value="0">-- Please Select --</option>
<option value="5">big</option>
<option value="6">small</option>
<option value="7">medium</option>
</select>

<select class="select3" onchange="handleChange($(this))">
<option value="0">-- Please Select --</option>
<option value="5">1</option>
<option value="6">2</option>
<option value="7">3</option>
</select>

<input type="submit" onclick="tryRefresh(2000)">

JS

var selected = 0;
function handleChange($select) {
  $select.val() ? selected++ : selected--;
}

function tryRefresh(delay) {
  if (selected === 3) {
    setTimeout(refresh, delay);
  }
}

function refresh() {
  window.location.reload(true);
}
于 2013-10-19T01:20:36.060 回答