我有以下复选框:
<form action="">
<input type="checkbox" id = "hide-completed" name="vehicle" value="Car">
<span id = 'checkbox-label'> Hide completed tasks</span>
</form>
我希望跨度内容在未选中该复选框时显示“隐藏已完成的任务”,在选中该复选框时显示“显示已完成的任务”。
可能重复的问题: 我看到了以下两个问题:
Changing html content back and forth with jQuery
Where has fn.toggle( handler(eventObject), handler(eventObject)...) gone?
第一个链接(切换处理程序)上建议的方法已被弃用,第二个链接上建议的替代方法对我不起作用。
谢谢
最佳答案
您可以在复选框的更改事件中找到选中/未选中状态,然后根据该状态附加内容:
$('#hide-completed').change(function(){
var c = this.checked ? 'Show completed tasks' : 'Hide completed tasks';
$('#checkbox-label').text(c);
});
关于javascript - 使用 jquery 来回更改标签的 html 内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26666708/