5

我最近开始将 Zurb Foundation 4 用于 Asp MVC 网站，但我不太了解开关控制应该如何工作。文档不多说http://foundation.zurb.com/docs/components/switch.html

<div class="switch">
  <input id="x" name="switch-x" type="radio" checked>
  <label for="x" onclick="">Off</label>

  <input id="x1" name="switch-x" type="radio">
  <label for="x1" onclick="">On</label>

  <span></span>
</div>

我正在使用这个示例代码，当我点击开关时，html 没有任何变化。我认为“checked”属性会出现在第二个输入上，但事实并非如此。

  • 如何检测单击了哪个单选按钮？

当我发布表单时，“switch-x”变量包含值“on”，无论开关在什么位置。

我尝试在标签上添加一个 onclick 事件，但它没有被触发，因为某些东西似乎与标签重叠。

我正在使用基金会的 javascript，页面上没有任何错误。

我肯定错过了一些东西......有什么想法吗？

4

2 回答 2

5

当我发布表单时，“switch-x”变量包含值“on”，无论开关在什么位置。

您需要在输入字段中添加一个值以具有 $_POST["switch-x"] 值，如下所示：

<div class="switch">
  <input id="x" name="switch-x" type="radio" value="0" checked>
  <label for="x" onclick="">Off</label>

  <input id="x1" name="switch-x" type="radio" value="1">
  <label for="x1" onclick="">On</label>

  <span></span>
</div>
于 2013-08-28T14:45:45.467 回答
3

如何检测单击了哪个单选按钮？

您的id每个无线电输入都有一个，因此您可以使用它们：

$('input[name=switch-x]:checked').attr('id');

这会给你一个x或x1。现在这取决于您将如何使用它。但是，如果您将它作为布尔值传递，我认为您会这样做，那么您可以简单地执行以下操作：

var isOn = $('input[name=switch-x]:checked').attr('id') == 'x1';

或者只是简单地

var isOn = $('#x1').is(':checked');

在此处查看实际操作

于 2013-04-29T10:31:39.447 回答