JQuery更改文本框的类答案

【问题标题】：JQuery changing class of a textboxJQuery更改文本框的类
【发布时间】：2014-08-13 07:33:14
【问题描述】：

我想通过单击链接将输入的类更改为 myClass2 并向后更改：

<a id="search" href=""></a>    
<input type="text" id="txtSearch" class="myClass1">

我的错误是什么都不会改变。我的 JQuery 看起来像这样：

<script type="text/javascript">
$("#search").click(function() {
$("#txtSearch").toggleClass('myClass1 myClass2');
});
</script>

【问题讨论】：

dom 准备好了吗？如果锚是空的，如何点击锚？
抱歉锚不是空的。我刚刚删除了文本。如何检查 dom？
@user3205343，看看我下面的答案
@user3205343 $(function() { // put jquery here });

标签： jquery class toggle

【解决方案1】：

你的代码已经可以运行了，你下载了jquery插件吗？

查看此示例FIDDLE

$("#search").click(function() {
$("#txtSearch").toggleClass('myClass1 myClass2');
});

【讨论】：

【解决方案2】：

你应该加上'return false';到您的点击功能。否则浏览器会跟随链接刷新浏览器。

<script type="text/javascript">
    $("#search").click(function() {
        $("#txtSearch").toggleClass('myClass1 myClass2');
        return false;
    });
</script>

【讨论】：

【解决方案3】：

你的代码应该是这样的：

$("#search").click(function() {
  $("#txtSearch").toggleClass('myClass2');
});

只给出一个类名。

注意：如果您同时给出两个类名，那么这将同时应用两个类属性，并且您找不到应用哪个类。

Read more here.

【讨论】：

【解决方案4】：

使用：

<script type="text/javascript">
$("#search").click(function() {
  var txtSearch = $("#txtSearch");
  txtSearch.toggleClass('myClass1');
  txtSearch.toggleClass('myClass2');
});
</script>

或：

<script type="text/javascript">
$("#search").click(function() {
  var txtSearch = $("#txtSearch");
  txtSearch.removeClass('myClass1');
  txtSearch.addClass('myClass2');
});
</script>

【讨论】：