從不使用escape()
。這與HTML編碼無關。這更像URL編碼,但它甚至不適合。這是一個奇怪的非標準編碼,只能在JavaScript中使用。
如果你想要一個HTML編碼器,你必須自己編寫它,因爲JavaScript不會給你一個。例如:
function encodeHTML(s) {
return s.replace(/&/g, '&').replace(/</g, '<').replace(/"/g, '"');
}
不過雖然這是足以讓你在user_id
像input value
地方,這是不夠的,因爲id
的ID只能使用有限的字符選擇。 (和%
不在其中,因此escape()
甚至encodeURIComponent()
是沒有好處的。)
你可以發明自己的編碼方案把任何字符的ID,例如:
function encodeID(s) {
if (s==='') return '_';
return s.replace(/[^a-zA-Z0-9.-]/g, function(match) {
return '_'+match[0].charCodeAt(0).toString(16)+'_';
});
}
但你如果user_id
發生兩次,仍然有問題。說實話,扔掉HTML字符串的整個過程通常是一個糟糕的主意。改爲使用DOM方法,並保留對每個元素的JavaScript引用,因此您不必一直調用getElementById
,或者擔心如何將任意字符串插入到ID中。
例如。:
function addChut(user_id) {
var log= document.createElement('div');
log.className= 'log';
var textarea= document.createElement('textarea');
var input= document.createElement('input');
input.value= user_id;
input.readonly= True;
var button= document.createElement('input');
button.type= 'button';
button.value= 'Message';
var chut= document.createElement('div');
chut.className= 'chut';
chut.appendChild(log);
chut.appendChild(textarea);
chut.appendChild(input);
chut.appendChild(button);
document.getElementById('chuts').appendChild(chut);
button.onclick= function() {
alert('Send '+textarea.value+' to '+user_id);
};
return chut;
}
您也可以使用便捷函數或JS框架來減少創建集附加調用的長度。
ETA:
我使用jQuery的那一刻作爲一個框架
OK,然後再考慮了jQuery 1.4創建的快捷方式,例如:
var log= $('<div>', {className: 'log'});
var input= $('<input>', {readOnly: true, val: user_id});
...
我現在的問題是,我使用JSONP添加元素和事件到一個頁面,所以我不知道這些元素是否已經存在或不存在之前顯示一條消息。
可以保持user_id
至元素節點(或包裝對象)在JavaScript中查找,保存把這些信息在DOM本身,可以在id
去字符的限制。
var chut_lookup= {};
...
function getChut(user_id) {
var key= '_map_'+user_id;
if (key in chut_lookup)
return chut_lookup[key];
return chut_lookup[key]= addChut(user_id);
}
(該_map_
前綴是因爲JavaScript對象不相當工作作爲任意字符串的映射。空字符串,在IE瀏覽器,一些Object
成員名稱,混淆。)
到底是什麼'id'的功能? – Tgr 2010-05-08 13:17:00
現在id是代表用戶的任何字符串。我用它來區分屬於不同用戶的頁面的類似結構。 通過這個邏輯,MD5或base64可能是一個很好的等待,我想。這只是沒有內置的東西。 – 2010-05-08 13:40:47