Question

我试图为复选框，单选按钮和选择框创建样式我从ryanfait [http://ryanfait.com/resources/custom-checkboxes-and-radio-buttons/]获得了一个插件，如果我们按照他提到的编码HTML，效果很好。

现在，我的问题有所不同。 HTML代码将如下所示。

<label class="checkBox">
    <input type="checkbox" id="rememberMember" class="styled"/>
    Remember me
</label>

OR

<input type="checkbox" id="rememberMember" class="styled"/>
<label class="checkBox" for="rememberMember">Remember me</label>

点击复选框后 - 没有显示勾号单击“记住我”文本时 - 显示刻度线。

我认为问题在于标签。

有没有办法（编辑JS文件）？ JS文件：http://ryanfait.com/resources/custom-checkboxes-and-radio-buttons/custom-form-elements.js

我放入JSfiddle，但它没有加载图像!!
http://jsfiddle.net/smilyface/pXETM/1/

Answer 1

从Styled checkbox and radios

下载js和css

Working Demo

完整代码

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
  <link rel="stylesheet" href="http://ryanfait.com/resources/custom-checkboxes-and-radio-buttons/form.css" />
  <script src="http://ryanfait.com/resources/custom-checkboxes-and-radio-buttons/custom-form-elements.js"></script>
</head>
<body>
  <input type="checkbox" id="rememberMember" class="vAlignMiddle styled" name="remember_member_id" />
<span class="checkBoxLabel">Remember me</span>
  <br/>
  <label>
    <input type="radio" class="styled" name="radio"/> Yes
</label>
<br/>
<label for="radio_no"> 
<input type="radio" class="styled" name="radio" id="radio_no">
No</label>
</body>
</html>

Demo

Answer 2

可能的解决方案是为输入字段分配标识符并应用

$( "#myObj" ).click(function() {
    // This is what gets executed onClick
    $( "#myCheckbox" ).prop("checked", true);
});

Answer 3

在js文件中可能存在冲突，您可以在Web浏览器的控制台中找到jquery错误。要解决此错误，您需要确定该控制台错误的解决方案。

Answer 4

试试这段代码。这将选中带有'复选框'

类标签的onclick复选框

<script>
    $('.checkBox').click(function() {
      $("#rememberMember").prop("checked", true);
    });
</script>

复选框：onclick not＆＃39; check＆＃39;盒子

4 个答案: