我有一个如下形式:

<label>
  scale a<input type="radio" name="sellorbuy" value="Yes" id="rdYes" />
</label>
<label class="leftspace">
  scale b<input type="radio" name="sellorbuy" value="No" id="rdNo" />
</label>

<p class="searchpg">Price</p>

<fieldset id="sell">
  <select id="pricemin" name="minsell" class="form-control">
    <option value="50000">Min Price</option>
    <option value="100000">£100,000</option>
    <option value="200000" >£200,000</option>
    <option value="300000" >£300,000</option>
    <option value="400000" >£400,000</option>
  </select>

  <select id="pricemax" name="maxsell" class="form-control">
    <option value="5000000">Max Price</option>
    <option value="100000">£100,000</option>
    <option value="200000">£200,000</option>
    <option value="300000">£300,000</option>
    <option value="400000">£400,000</option>
    <option value="500000">£500,000</option>
  </select>
</fieldset>

<fieldset id="let" style="display:none;">
  <select id="lpricemin" name="minbuy" class="form-control">
    <option value="500">Min Price</option>
    <option value="500">£500</option>
    <option value="600">£600</option>
    <option value="700">£700</option>
    <option value="800">£800</option>
    <option value="900">£900</option>
  </select>

  <select id="lpricemax" name="maxbuy" class="form-control">
    <option value="5000">Max Price</option>
    <option value="600">£600</option>
    <option value="700">£700</option>
    <option value="800">£800</option>
    <option value="900">£900</option>
    <option value="1000">£1000</option>
    <option value="1150">£1150</option>
  </select>
</fieldset>


这将通过以下方式切换字段集:

$("input[name='sellorlet']").change(function () {
    $("#sell").toggle(this.value == "Yes");
    $("#let").toggle(this.value == "No");
});


我遇到的麻烦是提交并显示在下一页上的搜索表单,因此我们保留了表单的内容。如果有人选择了“标尺B”,那么该标尺已在下一页上切换,但字段集没有更改?有什么方法可以更改到jQuery,以检测切换了哪个复选框并相应地更改字段集,甚至可以修改开关以使其更好地工作吗?

创建了一个小提琴以显示表单的工作方式https://jsfiddle.net/v3waaa20/1/

最佳答案

一些微小的变化和触发负载变化就可以解决问题。

$("input[name='sellorbuy']").change(function () {
    value = $("input[name='sellorbuy']:checked").val();
    $("#sell").toggle(value == "Yes");
    $("#let").toggle(value == "No");
}).change();

关于javascript - 具有复选框选项的HTML表单,用于选择字段集,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/32480127/

10-12 16:20