0
這一切如何應該當iFrameOn函數運行工作:查找對應的對象 - 獲取評論系統的工作?
- 將所有的iFrame的的designMode上
- 找到三個「按鈕」(「A」鏈接元素) - 當點擊時影響其相應的iFrame - 這取決於它的類名
- 把那些「按鈕」成多維數組/對象即target.rtfID.x
- 每當一個「按鈕」被點擊時,通過對象找到其對應的iFrame和發送的iFrame的id作爲另一個功能的參數離子。
但是,目前,只要有任何按鈕被點擊,它們都會影響相同的iFrame。我意識到這可能是由於我使用循環,但我無法弄清楚如何使它的一切工作。控制檯中沒有錯誤。
function iFrameOn() {
var rtfContainer, rtContainer, richTxt, richTxtId,
rtf = document.querySelectorAll('div > form > iframe'), //Rich Text Field
newPost = document.getElementById('richTextField').contentDocument.body,
target = {}, rtfIndex = 0;
//Turn iFrames On
while (rtfIndex < rtf.length) {
rtfID = rtf[rtfIndex].id;
if (rtf[rtfIndex].contentDocument.designMode != 'On') {
rtf[rtfIndex].contentDocument.designMode = 'On';
}
newPost.innerHTML = "<i style=\"color:#DDDDDD;\">What's up?</i>";
newPost.addEventListener('blur', function() {
if (newPost.innerHTML == '') {
newPost.innerHTML = "<i style=\"color:#DDDDDD;\">What's up?</i>";
}
}, false);
document.getElementById('richTextField').contentWindow.addEventListener(
'focus',
function() {
if (newPost.innerHTML == "<i style=\"color:#DDDDDD;\">What's up?</i>") {
newPost.innerHTML = '';
}
},
false
);
rtContainer = rtf[rtfIndex].nextElementSibling; //Next Element Sibling should be a div
console.log('rtContainer is: '+rtContainer);
richTxt = rtContainer.childNodes;
console.log('richTxt is: '+richTxt);
for (var i = 0; i < richTxt.length; i++) {
if (richTxt[i].nodeType != 1 ||
(richTxt[i].nodeType == 1 &&
(richTxt[i].className == 'submit_button sbmtPost'
|| richTxt[i].className == "")
)
) {
continue;
}
richTxtId = richTxt[i].id;
target.rtfID = {};
switch (richTxt[i].className) {
case 'richText bold':
if (target.rtfID.bold != richTxtId) {
target.rtfID.bold = richTxtId;
console.log(target.rtfID.bold+' is associated with: '+rtfID);
}
break;
case 'richText underline':
if (target.rtfID.underline != richTxtId) {
target.rtfID.underline = richTxtId;
console.log(target.rtfID.underline+' is associated with: '+rtfID);
}
break;
case 'richText italic':
if (target.rtfID.italic != richTxtId) {
target.rtfID.italic = richTxtId;
console.log(target.rtfID.italic+' is associated with: '+rtfID);
}
break;
default:
console.log('Error with commenting system!');
break;
}
}
var obj = target.rtfID;
for (var prop in obj) {
if (obj.hasOwnProperty(prop)) {
console.log("prop: " + prop + " value: " + obj[prop]);
switch(prop) {
case 'bold':
document.getElementById(obj[prop]).addEventListener(
'click',
function() {
bold(obj[prop]);
},
false
);
break;
case 'underline':
document.getElementById(obj[prop]).addEventListener(
'click',
function() {
Underline(obj[prop]);
},
false
);
break;
case 'italic':
document.getElementById(obj[prop]).addEventListener(
'click',
function() {
Italic(obj[prop]);
},
false
);
break;
default:
console.log('Error in for...in loop');
}
} else {console.log('error');}
}
rtfIndex++;
}
}
而不必一個簡單的方法來測試/檢查,我會打賭你的問題是因爲你不應該在循環中定義函數 - 它會導致這樣的問題。內部函數繼續訪問外部範圍,因此在執行時,它們將抓取循環中最後一個iframe的信息。您可以通過將循環中變化的值傳遞給一個函數來解決這個問題,該函數本身會返回您想要的函數。 –
這似乎是問題所在。任何方式,我可以避免在循環內定義函數?我這樣做的唯一理由是因爲我的富文本函數帶有參數,我不能將參數放入addEventListener方法中。編輯:說太快了。我無法在iFrame之間來回切換。現在它隻影響它找到的最後一個iFrame。 – Azrael