HTML中如何实现radio选项不同时js使用不同的功能?

JavaScript06

HTML中如何实现radio选项不同时js使用不同的功能?,第1张

使用js监听radio选中值,然后根据选中值配置哪些功能可以使用.

如果是使用vue或者其他框架,则可以通过如值的变化或者watch来进行操作.

参考代码:

<div>

      <label><input type="radio" name="r1" value="j1">j1</label>

      <label><input type="radio" name="r1" value="j2">j2</label>

      <label><input type="radio" name="r1" value="j3">j3</label>

  </div>

<script>

  /*监听name=r1的input值变化,并执行相关操作*/

  $('[name="r1"]').on('change', function() {

      console.log($(this).val())

  })

</script>

1.创建微信小程序项目;2.在index.wxml文件中添加按钮组件代码;3.在index.wxss文件里添加两种按钮样式;4.在index.js文件中添加交互代码来测试效果;5.保存编辑的代码并进行调试即可。