查看此jsFiddle

Question

我试图用jQuery从一个值中减去1（一）。我设法这样做了：

$('.notis').text(parseInt($(".notis").text()) - 1);

问题是<a>这会从这样的外观中减去：

<a href="#" class="notis"><img src="/images/icons/picture.png">3</a>

因此上面的jquery将从值中减去1（一），但也删除图像！我该怎么做和保持图片的HTML？

Answer 1

您可以将图像存储在临时变量中，然后使用prepend方法将其添加到节点：

$('.notis').each(function() {
    var $this = $(this);                        // <-- Reference to current elem
    var $img = $this.find('img');               // <-- Reference to <img>
    $this.text(parseInt($this.text(), 10) - 1); // <-- Your logic
    $this.prepend($img);                        // <-- Add image again.
});

演示：http://jsfiddle.net/sPnhL/

附加说明：

使用parseInt( ... , 10)代替parseInt( ... )。以零为前缀的数字将在浏览器中不一致地处理。通过指定基数为10，数字将被正确解析。
$('.notis')选择类notis的所有元素。当您使用$('notis').text($('notis').text()-1)时，类notis的所有元素都将包含第一个.notis元素的值（因为$('.notis').text()会返回值第一个.notis）。这就是我在代码中使用.each的原因。

当您不止一次使用$(this)时，值得将变量$(this)存储在临时变量中，以提高效率。

Answer 2

可能有更好的解决方案，但您可以保存link元素的子元素，并在更改文本后重新附加它们：

$('.notis').each(function (index, element) {
    var $children = $(this).children();
    $(this).text(parseInt($(this).text()) - 1).prepend($children);
});

以下是演示：http://jsfiddle.net/epuxy/（点击链接时查看底部更改的数字）

Answer 3

我建议将数字用<span>换行并替换其内容。

Answer 4

将3包裹在div或span（首选）类中并从那里开始。

Answer 5

最佳解决方案是在您的号码周围添加span。这样可以获得最佳性能。

<强> HTML

<a href="#" class="notis"><img src="/images/icons/picture.png"><span>3</span></a>

<强>的jQuery

$('.notis > span').text(parseInt($(".notis").text()) - 1);

Jquery从.text中减去1并保留html

5 个答案:

演示：http://jsfiddle.net/sPnhL/

查看此jsFiddle