jquery .text()无法处理点击

时间:2014-10-13 10:50:27

标签: jquery html5

我正在尝试创建一个可以设置的锚标签,直到现在实现这一点我希望它在点击时切换fa图标和文本。到目前为止fa图标切换,但无法切换文本任何人都可以告诉我如何做到这一点。

HTML

<h5 class="text-muted"> Education <a id="btnExp" class="fa fa-plus">ADD</a> </h5>

JS

$('h5 #btnExp').on('click', function () {
    $("h5 #btnExp").toggleClass("fa fa-minus fa fa-plus");
    $("#btnExp").text("123");
});

2 个答案:

答案 0 :(得分:3)

$("#btnExp").text("123");更改为$(this).text("123");

答案 1 :(得分:3)

您需要阻止其默认操作,因为元素是锚。还要将代码包装在document-ready handler

&#13;
&#13;
$(document).ready(function() {
  $('h5 #btnExp').on('click', function() {
    $("h5 #btnExp").toggleClass("fa fa-minus fa fa-plus");
    $(this).text($(this).text() === '123' ? 'ADD' : '123'); //Also toggle text
    return false;
  });
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h5 class="text-muted"> Education <a id="btnExp" class="fa fa-plus">ADD</a> </h5>
&#13;
&#13;
&#13;