Question

我有一些表单具有自定义样式的复选框和单选按钮，具有漂亮的可检查性（来自http://arthurgouveia.com/prettyCheckable/）。

我试图让它像这样工作，以便在选中/勾选复选框或收音机时自动提交表单。

<script type"text/javascript">
$(":checkbox").click(function() {
  $(this).closest("form").submit();
});
</script>

和

<script type"text/javascript">
$(":radio").click(function() {
  $(this).closest("form").submit();
});
</script>

但点击后绝对没有任何反应。我想这可能是因为实际的复选框被一个样式的span替换为prettycheckable。我如何抓住这个＆＃34;点击＆＃34;反正？

更新：

我试过了：

<script type"text/javascript">
$(":checkbox").on('change', function() {
  $(this).closest("form").submit();
});
</script>

但它也没有用。我有一种感觉我很接近，但我并不擅长jQuery ......

似乎有人在这里遇到了同样的问题：

https://github.com/arthurgouveia/prettyCheckable/issues/51

以上对他们有用......也许我在某个地方有一个小错误？

更多更新：

这是一个使用相同标记的JSFiddle：）

http://jsfiddle.net/MKChris/5y2Uz/

Answer 1

我刚刚查看了漂亮的可检查源代码 - 如果您像在主页上提供的那样使用它，则输入（无论是radiobox还是复选框）的样式为<a href="#"/>。所以你可以尝试 - 给出一个id =＆＃34; test＆＃34;作为表单的容器：

$("#test a").click(function() {
  $(this).closest("form").submit();
});

更新：由于Fiddle提供了实际的标记，我只是对其进行了更新：Fiddle 只需检查控制台，上面的回答对我有用。我刚刚添加了一个类=＆＃34; test＆＃34;对于包含表单的div并添加

$j(".test a").click(function() {
              console.log("click");
});

当您检查时，例如Firebug，您会注意到样式化的复选框的样式为<a href="#/>

Answer 2

应用prettyCheckable()会改变html，包括隐藏复选框并将其括在div中。 html看起来像

<div class="clearfix prettycheckbox labelleft  blue">
  <input type="checkbox" id="use_4" name="4" data-label="Hasbeens" value="1" checked="checked" style="display: none;">
  <label for="use_4">Hasbeens</label>
  <a href="#" class="checked "></a>
</div>

您需要处理封闭式click的{{1}}事件，并检查div的状态

checkbox

See updated fiddle

onclick表单提交不使用prettycheckable样式复选框/收音机

2 个答案: