試圖讓腳本工作使用Javascript的替換字符串

我只是在處理這個腳本，但我不明白爲什麼它不會運行！任何幫助讚賞。試圖讓腳本工作使用Javascript的替換字符串

的Javascript

$(document).ready(function() { 
var str = document.getElementById('size').innerHTML; 
var res = str.replace('<p>','<input type="checkbox" value="'); 
var res = str.replace('</p>','" id="size" name="size[]" checked />'); 
document.getElementById('size').innerHTML=res; 
});

HTML

<div id="size"> 
    <p>xs</p> 
    <p>s</p> 
    <p>m</p> 
    <p>l</p> 
    <p>xl</p> 
</div>

這裏的JS小提琴：http://jsfiddle.net/L2LGV/

來源

2013-11-28 Cozmoz

'未捕獲的ReferenceError：$不是defined' - **讀取錯誤控制檯**在您的瀏覽器！ – Quentin

使用jQuery（一旦包含）來修改屬性，而不是修改實際的html字符串。 – Johan

這是一個可怕的方式來取代網頁上的內容.....你需要研究一些dom操作，看看這裏提供的jQuery方法，並重新思考你的想法 - http://api.jquery.com/類別/操縱/ –

首先，不包括jQuery的。

那麼這裏是你的代碼做：

var res = str.replace('<p>','<input type="checkbox" value="'); 
// replace str which is equal to <p>...</p> to <input type="checkbox" value="...</p> 
var res = str.replace('</p>','" id="size" name="size[]" checked />'); 
// replace str which is equal to <p>...</p> to <p>" id="size" name="size[]" checked />

嘗試使用這個：

var res = str.replace('<p>','<input type="checkbox" value="'); 
var res = res.replace('</p>','" id="size" name="size[]" checked />');

另外，如果你想更換每一次出現，使用正則表達式：

var res = str.replace(/<p>/g,'<input type="checkbox" value="'); 
var res = res.replace(/<\/p>/g,'" id="size" name="size[]" checked />');

http://jsfiddle.net/L2LGV/6/

來源

2013-11-28 15:04:03

謝謝，這是非常幫助我讓我看看我的腳本出錯了。 – Cozmoz

你試圖去做的方式並不是最好的方法。

查看我如何實現它的這個快速示例。

$(document).ready(function() { 
    jQuery('#size p').each(function(){ 
     var html = '<input type="checkbox" value="' + jQuery(this).text() + 'id="size" name="size[]" checked />'; 
     jQuery(this).replaceWith(html); 
    }); 
});

http://jsfiddle.net/L2LGV/5/

來源

2013-11-28 15:04:20 CharliePrynn

警告的話，你應該首先逃避

的價值。 – CharliePrynn

謝謝，我會在再次詢問它之前執行此操作並閱讀更多關於JavaScript和jQuery的內容。 – Cozmoz

月1日，您覆蓋RES通過聲明它兩次變量：

var res = str.replace('<p>','<input type="checkbox" value="'); 
var res = str.replace('</p>','" id="size" name="size[]" checked />');

這應該是：

var res = str.replace('<p>','<input type="checkbox" value="'); 
res += str.replace('</p>','" id="size" name="size[]" checked />');

其次，你不包括jQuery的。

請注意using innerHTML is a bad idea！使用jQuery的html函數。最後但並非最不重要的是：當你選擇getElementById的元素時，爲什麼使用jQuery？！？使用$('#<id>') ..

來源

2013-11-28 15:04:56 Alex

這裏有一個解決方案，而str.replace()：

$(document).ready(function() { 
    var list = document.getElementById('size').getElementsByTagName('p'), output = ''; 
    for(var i = 0; i < list.length; ++i){ 
     output += '<input type="checkbox" value="'; 
     output += list[i].innerHTML; 
     output += '" id="size" name="size[]" checked />'; 
    } 
    document.getElementById('size').innerHTML=output; 
});

http://jsfiddle.net/L2LGV/7/

來源

2013-11-28 15:27:59

試圖讓腳本工作使用Javascript的替換字符串

回答

相關問題