Javascript .replace（）在全球範圍內不能工作

我一直在研究一個簡單的jQuery插件，它將基本上模板json數據。它允許您提供一個html模板url，數據url和目標，用於顯示數據的位置。我遇到的問題是，當我這樣做時：Javascript .replace（）在全球範圍內不能工作

var regex = new RegExp('[['+ key +']]', 'g'); 
tplHTML = tplHTML.replace(regex, this[key]);

它只是替換它找到的第一個情況，而不是跟隨全局標誌。

這裏就是調用到插件製作並顯示在數據頁：

<!DOCTYPE html> 
<head> 
<title></title> 

<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,700,600' rel='stylesheet' type='text/css'> 

<style> 
* { font-family: 'Open Sans', sans-serif; color: #666; font-weight: 100; line-height: 150%; font-size: 1.0em; } 
.container { width: 960px; margin: 0 auto; padding: 10px; border: 1px solid #ccc; } 
    .left { width: 460px; float: left; } 
    .right { width: 400px; float: right; } 

td, th { text-align: left; vertical-align: top; border: 1px solid #f5f5f5; padding: 10px; font-size: .8em; } 
.clear { clear: both; } 
</style> 

</head> 
<body> 

<div class="container"> 
    <div class="left"> 
     <table id="users"> 
      <tr> 
       <th>ID</th> 
       <th>Name</th> 
       <th>Email</th> 
       <th>Phone</th> 
      </tr> 
     </table> 
    </div> 
    <div class="right"> 
     <table id="comments"> 
      <tr> 
       <th>ID</th> 
       <th>User id</th> 
       <th>Comment</th> 
       <th>Date</th> 
      </tr> 
     </table> 
    </div> 

    <div class="clear"></div> 
</div> 

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
<script src="js/userData.js"></script> 
<script src="js/templatize.ajax.js"></script> 

<script> 
$('#users').templatize({ 
    itemsURL: 'process/ajaxUsers.php?l=5&order=ASC', 
    tplURL: 'tpl/usersTpl.php', 
    targetHTML: '#users' 
}); 

$('#comments').templatize({ 
    itemsURL: 'process/ajaxComments.php?l=5&order=ASC', 
    tplURL: 'tpl/commentTpl.php', 
    targetHTML: '#comments' 
}); 
</script> 

</body> 
</html>

這裏是插件代碼：

(function ($) { 

    $.fn.templatize = function(options) { 

     /*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% 
     %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% Configuration Settings %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% 
     %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/ 
     var config = $.extend({ 
      debugging   :  false, 
      targetHTML   :  '.container', 
      output    :  '', 
      tplURL    :  '', 
      itemsURL   :  '', 
      tpl     :  '', 
      items    :  '' 
     }, options); 

     init(); 

     /*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% 
     %%%%%%%%%%%%%%%%%%%%%%%%%%%%%% Initialize & Retrieve Data Objects %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% 
     %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/ 
     function init() { 

      var tpl, itemsObj; 

      $.ajax({ 
       type: "GET", 
       url: config.tplURL, 
       data: 'json', 
       async: false, 
       success: function(info) { 
        tpl = info; 
       } 
      }); 

      $.ajax({ 
       type: "GET", 
       url: config.itemsURL, 
       data: 'json', 
       async: false, 
       success: function(items) { 
        itemsObj = items; 
       } 
      }); 

      config.tpl = tpl; 
      config.items = itemsObj; 

      templatize(); 

     } 

     /*%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% 
     %%%%%%%%%%%%%%%%%%%%%%%%%%% Receive Data & Replace tags for template %%%%%%%%%%%%%%%%%%%%%%%%%%%%% 
     %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%*/ 
     function templatize() { 

      var tplHTML = ''; 
      var i = jQuery.parseJSON(config.items); 

      if(config.debugging) { 
       console.log(i); 
      } 

      $(i).each(function() { 

       tplHTML = config.tpl; 

       for (var key in this) { 

        //tplHTML = tplHTML.replace('[['+ key +']]', this[key]); 
        var regex = new RegExp('[['+ key +']]', 'g'); 
        tplHTML = tplHTML.replace(regex, this[key]); 

       } 

       config.output += tplHTML; 
      }); 

      $(config.targetHTML).append(config.output); 

      if(config.debugging) { 
       console.log('Target for data placement: '+ config.targetHTML); 
      } 

     } 

    }; 

}) (jQuery);

最後這裏是模板代碼：

<tr><td>[[id]]</td><td><a href="user.php?id=[[id]]">[[name]]</a></td><td>[[email]]</td><td>[[phone]]</td></tr>

我正在使用類似於smarty標籤的類似標籤結構格式。我一直在研究各種文檔，並且沒有找到適合我的解決方案。任何幫助將不勝感激！

總的來說，我只需要找出一種方法來獲取javascripts .replace（）方法來替換不僅僅是匹配的第一個實例，而是所有的實例。我試過一個版本，似乎只與Firefox兼容，其中.replace（搜索，更換，旗）

感謝

來源

2013-08-04 Tom Bird

首先，我想你打算您正則表達式使用變量key不是字符串"key"，所以它應該是：

new RegExp('[[' + key + ']]', 'g')

其次[有一個正則表達式中的特殊含義，因此需要進行轉義：

new RegExp('\\[\\[' + key + ']]', 'g')

因爲你是從一個字符串構建你的正則表達式，所以你需要一個雙反斜槓來轉義每個[，所以對於key的"id"，得到的正則表達式將是\[\[id]]。

來源

2013-08-04 02:26:05 nnnnnn

謝謝你，你正確的我一直在搞這樣的測試，儘可能多的測試方法，因爲我希望能夠點擊彩票，然後在發佈到這裏之前忘了改回它。謝啦！！！這一直在困擾我一段時間！ –

Javascript .replace（）在全球範圍內不能工作

回答

相關問題