Question

我试图在每次点击时使字体变大，但它只在这里做了一次是我的代码。

<a href="5">add</a>
<script type="text/javascript">
$('a').live('click', function(e){
e.preventDefault();

    var link = $(this).attr('href');

        var num = link+20;

        var font = {color:"#993300", fontSize:num+"px"};

        $("p").css(font);

        return false;

});
</script>

任何帮助???

Answer 1

您必须将值重新设置为href才能再次使用。这是代码（未测试）

<a href="5">add</a>
<script type="text/javascript">
$('a').live('click', function(e){
e.preventDefault();

    var link = $(this).attr('href');

        var num = link+20;
        $(this).attr('href', num)

        var font = {color:"#993300", fontSize:num+"px"};

        $("p").css(font);

        return false;

});
</script>

Answer 2

你忘记把新的数字放回href：

添加以下行：

$(this).attr('href', num);

Answer 3

原因是您将fontSize更新为href的值+设定值。你应该在哪里使用当前的fontSize。代码将变为：

<a href="5">add 5</a>
<a href="10">add 10</a>
<script type="text/javascript">
$('a').live('click', function(e) {
  e.preventDefault(); // Prevent our default method

  var oldSize = $("p").css('fontSize'); // Get the current fontsize
  var increment = $(this).attr('href'); // Get the amount we want to increment
  var newSize = oldSize + increment; // Calculate the new size

  var newCss = {color: "#993300", fontSize: newSize+"px"}; // Format our CSS
  $("p").css(newCss); // Apply it

  return false;
});
// Or for short:
$('a').live('click', function (e) {
  e.preventDefault();
  $("p").css{color: "#993300", fontSize: ($("p").css('fontSize') + $(this).attr('href')) + "px"});
});
</script>

单击jquery更大的字体大小

3 个答案: