跨域表單提交狀態(tài)的變相判斷代碼
更新時間:2009年11月12日 02:17:47 作者:
通過表單在iframe內(nèi)向一個跨域的url提交的時候,如何判斷提交成功了呢?這個,基本上,很難,因為瀏覽器安全沙箱的限制,我們沒有辦法通過獲得iframe內(nèi)部不同域頁面的信息。
拐個彎想,如果開始可以獲得iframe內(nèi)部頁面信息,那么不能獲得的時候,不就說明表單已經(jīng)提交了么~
我們發(fā)現(xiàn)百度的競價右下角信息,也是采用的這種方法判斷的,大家可以參考下。
示例:
test.html:
<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"></head>
<body style="background:#a7a7a7;">
<iframe id="testiframe" name="testiframe"></iframe>
<form method="post" action="http://www.test.com/testaction.php" target="testiframe" name="testform">
<input type="text" name="dddd"><input type="submit" value="ddd" name="submitbtn"/>
</form>
</body>
<script>
document.testform.onsubmit = function () {
document.testform.submitbtn.disabled = true;
submitMonitor();
}
function submitMonitor () {
try{
var hash = document.getElementById('testiframe').contentWindow.location.hash;
setTimeout(submitMonitor,100);
} catch (e) {
document.getElementById('testiframe').src = "about:blank";
document.testform.submitbtn.disabled = false;
}
}
</script>
</html>
注意下面的代碼是跨域的,不是在一個域名下的
testaction.php
<?php
sleep(5);
echo $_POST['dddd'];
?>
弊端:
這個弊端還很明顯,如果是404,403,500等錯誤,也會誤認為是成功提交。
所以,請注意:此方法屬研究,開拓思維用。
這段是百度的判斷代碼
var sfMessTimes;
function sfMessSubmitMonitor () {
try{
var hash = sf_mess_lib.getElement(SF_MESS_FRAME_ID).contentWindow.location.hash;
sfMessTimes ++;
if (sfMessTimes > 50) {
alert(sf_mess_msg.fail);
sf_mess_lib.getElement(SF_MESS_SUBMIT_ID).disabled = false;
for (var i = 0, l = sf_mess_cols.length; i < l; i++) {
document.getElementById(SF_MESS_PREFIX + sf_mess_cols[i].idname).disabled = false;
}
} else {
setTimeout(sfMessSubmitMonitor,100);
}
} catch (e) {
sf_mess_lib.getElement(SF_MESS_FRAME_ID).src = "about:blank";
alert(sf_mess_msg.success);
sf_mess_lib.getElement(SF_MESS_SUBMIT_ID).disabled = false;
for (var i = 0, l = sf_mess_cols.length; i < l; i++) {
var inputCfg = sf_mess_cols[i];
var inputEl = document.getElementById(SF_MESS_PREFIX + inputCfg.idname);
inputEl.disabled = false;
inputEl.value = filtInnertip(inputCfg.innertip);
}
}
}
我們發(fā)現(xiàn)百度的競價右下角信息,也是采用的這種方法判斷的,大家可以參考下。
示例:
test.html:
復制代碼 代碼如下:
<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=gb2312"></head>
<body style="background:#a7a7a7;">
<iframe id="testiframe" name="testiframe"></iframe>
<form method="post" action="http://www.test.com/testaction.php" target="testiframe" name="testform">
<input type="text" name="dddd"><input type="submit" value="ddd" name="submitbtn"/>
</form>
</body>
<script>
document.testform.onsubmit = function () {
document.testform.submitbtn.disabled = true;
submitMonitor();
}
function submitMonitor () {
try{
var hash = document.getElementById('testiframe').contentWindow.location.hash;
setTimeout(submitMonitor,100);
} catch (e) {
document.getElementById('testiframe').src = "about:blank";
document.testform.submitbtn.disabled = false;
}
}
</script>
</html>
注意下面的代碼是跨域的,不是在一個域名下的
testaction.php
復制代碼 代碼如下:
<?php
sleep(5);
echo $_POST['dddd'];
?>
弊端:
這個弊端還很明顯,如果是404,403,500等錯誤,也會誤認為是成功提交。
所以,請注意:此方法屬研究,開拓思維用。
這段是百度的判斷代碼
復制代碼 代碼如下:
var sfMessTimes;
function sfMessSubmitMonitor () {
try{
var hash = sf_mess_lib.getElement(SF_MESS_FRAME_ID).contentWindow.location.hash;
sfMessTimes ++;
if (sfMessTimes > 50) {
alert(sf_mess_msg.fail);
sf_mess_lib.getElement(SF_MESS_SUBMIT_ID).disabled = false;
for (var i = 0, l = sf_mess_cols.length; i < l; i++) {
document.getElementById(SF_MESS_PREFIX + sf_mess_cols[i].idname).disabled = false;
}
} else {
setTimeout(sfMessSubmitMonitor,100);
}
} catch (e) {
sf_mess_lib.getElement(SF_MESS_FRAME_ID).src = "about:blank";
alert(sf_mess_msg.success);
sf_mess_lib.getElement(SF_MESS_SUBMIT_ID).disabled = false;
for (var i = 0, l = sf_mess_cols.length; i < l; i++) {
var inputCfg = sf_mess_cols[i];
var inputEl = document.getElementById(SF_MESS_PREFIX + inputCfg.idname);
inputEl.disabled = false;
inputEl.value = filtInnertip(inputCfg.innertip);
}
}
}
相關文章
淺談Javascript中的函數(shù)、this以及原型
下面小編就為大家?guī)硪黄獪\談Javascript中的函數(shù)、this以及原型。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-10-10
基于JavaScript實現(xiàn)鼠標懸浮彈出跟隨鼠標移動的帶箭頭的信息層
這篇文章主要介紹了基于JavaScript實現(xiàn)鼠標懸浮彈出跟隨鼠標移動的帶箭頭的信息層 的相關資料,需要的朋友可以參考下2016-01-01
快速掌握WordPress中加載JavaScript腳本的方法
這篇文章主要介紹了快速掌握WordPress中加載JavaScript腳本的方法,以及響應的CSS樣式加載方法的簡介,需要的朋友可以參考下2015-12-12

