Question

我正在构建的电子应用程序中的复选框有问题。

该复选框运行良好，并返回正确的值；如果选中，则返回true；否则返回false。

当我向应用程序中添加一些库时，复选框在选中或未选中时开始返回假值。

这是项目的属性：

Package.Json

"dependencies": {
    "dexie": "^2.0.4",
    "electron-titlebar-windows": "^3.0.0",
    "jquery": "^3.3.1",
    "lodash": "^4.17.10",
    "material-design-icons": "^3.0.1",
    "materialize-css": "^1.0.0-rc.2",
    "talkify-tts": "^2.1.2",
    "typeface-roboto": "0.0.54"
  },
  "devDependencies": {
    "electron": "^2.0.4",
    "electron-packager": "^12.1.0"
  }

Index.html

// First option
$('#roswitch').change(() => {
  if ($(this).prop("checked")) {
    console.log("Checked")
  } else {
    console.log("Not Checked")
  }
})

// Second option

$('#roswitch').change(() => {
  if ($(this).is(":checked")) {
    console.log("Checked")
  } else {
    console.log("Not Checked")
  }
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="switch">
  <label>
    Off
    <input id="roswitch" value="false" type="checkbox">
    <span class="lever"></span>
    On
  </label>
</div>

我在JQuery中尝试了两个选项，并且都返回false。

谢谢

Answer 1

附加更改事件时语法不正确。由于发生了哪个更改事件，所以在附加事件时（而不是在状态更改时）返回检查状态值。应该是：

 $('#roswitch').change(function(){
  if ($(this).prop("checked")) {
    console.log("Checked")
  } else {
   console.log("Not Checked")
  }
})

// First option
 $('#roswitch').change(function(){
  if ($(this).prop("checked")) {
console.log("Checked")
  } else {
   console.log("Not Checked")
  }
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="switch">
  <label>
    Off
    <input id="roswitch" value="false" type="checkbox">
    <span class="lever"></span>
    On
  </label>
</div>

jQuery checkbox.prop（'checked'）始终返回假值

1 个答案: