Javascript添加逗号而不删除DIV [英] Javascript add comma to price without deleting DIV

问题描述

我在客户的WordPress网站上使用WP-Properties插件。价格需要数千个逗号。该页面上的HTML是：

 < li class =property_price> 
< div>价格：< / div> $ 54000.00美元
< / li> 
  

您无法在插件管理员的价格中添加逗号，因为逗号指定下拉菜单中的行。所以我使用下面的javascript来添加逗号：

  function addCommas（nStr）
 {
 nStr + =''; 
 x = nStr.split（'。'）; 
 x1 = x [0]; 
 x2 = x.length> 1？ '。'+ x [1]：''; 
 var rgx = /（\ d +）（\ d {3}）/; 
 while（rgx.test（x1））{
 x1 = x1.replace（rgx，'$ 1'+'，'+'$ 2'）; 
} 
 return x1 + x2; 
 
 $（。property_price）。each（function（）{
 var self = $（this），text = self.text（）; 
 self.text （addCommas（text））; 
}）; 
  

这可以工作，但它也会将< div> code>围绕标签，所以得到的HTML是：

 < li class =property_price> 
价格：$ 54,000.00美元
< / li> 
  

如何调整javascript，以便添加逗号并保持< ; div> ？

解决方案

为什么不使用



  $（。property_price）。each（function（）{
 var self = $（this），text = self.text（）; 
 self.html（< div> + addCommas（text）+< / div>）; 
}）; 
  

只需简单地附加< div>< / div> 标记到正在插入的HTML中。另外，使用HTML时，您应该使用 .html（）而不是 .text（）





观看 http://jsfiddle.net/VTjeM/作为样本。

编辑

正如James Montagne指出的，不起作用。不过，我修改了这个例子，并且这个作品。

它采用不同的方法（获取HTML，删除 div ，用逗号计算值，然后重新生成HTML）。 b
$ b

编辑

以下是适合我的完整代码。我将这个标记为我接受的答案〜Trishah：
$ b $ pre $ function addCommas（nStr）{
nStr + =' ;
x = nStr.split（'。'）;
x1 = x [0];
x2 = x.length> 1？ '。'+ x [1]：'';
var rgx = /（\ d +）（\ d {3}）/;
while（rgx.test（x1））{
x1 = x1.replace（rgx，'$ 1'+'，'+'$ 2'）;
}
return x1 + x2;

$（。property_price）。each（function（）{
var self = $（this）;
//移除div，我们不需要it
self.find（div）。remove（）;
text = self.text（）;
self.html（< div> Price：< / div> + addCommas（text））;
}）;


I am using the WP-Properties plugin on a client's WordPress site. The prices need a comma for thousands. The HTML on the page is:

<li class="property_price">
<div>Price:   </div> $54000.00 USD
</li>

You can not add commas to the price in the plugin admin because commas designate rows in the dropdown menus. So I am using the following javascript to add the commas:

function addCommas(nStr)
{
    nStr += '';
    x = nStr.split('.');
    x1 = x[0];
    x2 = x.length > 1 ? '.' + x[1] : '';
    var rgx = /(\d+)(\d{3})/;
    while (rgx.test(x1)) {
        x1 = x1.replace(rgx, '$1' + ',' + '$2');
    }
    return x1 + x2;
}
$(".property_price").each(function() {
   var self = $(this), text = self.text();
   self.text(addCommas(text));
});

This works, but it also stripes out the <div> around the label so the resulting HTML is:

<li class="property_price">
Price:    $54,000.00 USD
</li>

How do I tweak the javascript so it adds the comma and keeps the <div>?

解决方案

Why not use

$(".property_price").each(function() {
   var self = $(this), text = self.text();
   self.html("<div>" + addCommas(text) + "</div>");
});

Just simply append the <div></div> tags to the HTML that's being inserted. Also, you should be using .html() instead of .text() when playing with HTML

Take a look at http://jsfiddle.net/VTjeM/ for a sample.

EDIT

As James Montagne pointed out, this doesn't work. However I revised the example, and this one works.

It takes a different approach (it gets the HTML, deletes the div, calculates the value with the comma, then rebuilds the HTML).

EDIT

Here is the full code that worked for me. I'm marking this as my accepted answer ~Trishah:

    function addCommas(nStr) {
    nStr += '';
    x = nStr.split('.');
    x1 = x[0];
    x2 = x.length > 1 ? '.' + x[1] : '';
    var rgx = /(\d+)(\d{3})/;
    while (rgx.test(x1)) {
        x1 = x1.replace(rgx, '$1' + ',' + '$2');
    }
    return x1 + x2;
}
$(".property_price").each(function () {
    var self = $(this);
    // remove the div, we don't need it
    self.find("div").remove();
    text = self.text();
    self.html("<div>Price: </div>" + addCommas(text));
});

这篇关于Javascript添加逗号而不删除DIV的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！