Javascript - 使用開關更改iframe src

-1

我一直在爲此掙扎兩天。我被要求建立一種登錄頁面。它不必提供任何實際的安全性，它的目的只是根據他們輸入的代碼將人員引導到不同的站點。我已經開關工作，它會在適當的數字通過表單發送時觸發警報，但是當我給它更新我的iframe src的數字時，什麼都不會發生。我完全困惑，我有這個相同的代碼工作來更新從按鈕按下的iframe，但它不會在這裏工作。任何幫助將不勝感激。Javascript - 使用開關更改iframe src

<!doctype html> 
 
<html> 
 
<head> 
 
<meta charset="utf-8"> 
 
<title>Test</title> 
 
<style type="text/css"> 
 
body { 
 
\t background-image: url(IMAGES/bgTile.png); 
 
\t background-repeat: repeat; 
 
\t position: absolute; 
 
\t width: 100%; 
 
\t height: 100%; 
 
} 
 
.pageFrame { 
 
\t padding: 0px; 
 
\t height: 797px; 
 
\t width: 1809px; 
 
\t overflow: hidden; 
 
\t position: absolute; 
 
\t z-index: 1; 
 
} 
 
.loginForm { 
 
\t position: absolute; 
 
\t top: 45%; 
 
\t left: 50%; 
 
\t width: 211px; 
 
\t height: 74px; 
 
\t text-align: center; 
 
\t margin-left: -105.5px; 
 
\t margin-top: 42px; 
 
\t font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif; 
 
\t color: #FFFFFF; 
 
\t line-height: 21px; 
 
\t margin-bottom: 5px; 
 
\t z-index: 2; 
 
} 
 
.submitButton { 
 
\t margin-top: 5px; 
 
} 
 
</style> 
 
</head> 
 
<script type="text/javascript"> 
 
<!-- 
 
function runLogin(form) { 
 
\t var login = form.dealerID.value; 
 
\t switch(login) { 
 
    \t case "1": 
 
\t \t \t loadDealer("0"); 
 
     \t break; 
 
    \t case "2": 
 
     \t alert("this"); 
 
     \t break; 
 
    \t case "3": 
 
     \t alert("that"); 
 
     \t break; 
 
    \t \t default: 
 
     \t alert("the other thing");; 
 
     \t break; 
 
\t } 
 
} 
 

 
var dealershipsArray = [ 
 
"NULL_IMAGES/filmstripNull.html" 
 
]; 
 

 
function loadDealer(i) { 
 
\t var dealership = document.getElementById("dealerContainer"); 
 
\t dealership.src = dealershipsArray[i]; 
 
} 
 
//--> 
 
</script> 
 

 
<body> 
 
<iframe id="dealerContainer" class="pageFrame" scrolling="no" frameborder="0" seamless></iframe> 
 
<div class="lutherLogo"></div> 
 
<div id="loginBox" class="loginForm"><form name="myForm" onsubmit="runLogin(this)"> 
 
    Please Enter Your Dealer Display Code<br> 
 
     <input type=TEXT value="" name="dealerID"> 
 
     <div class="submitButton"><input type=BUTTON value="Submit" name="myButton"></div> 
 
    </form> 
 
</div> 
 
</body> 
 
</html>

來源

2015-06-19 Skelex

它是否工作，如果你改變loadDealer（「0」）; loadDealer（0）; – loli

非常不恰當的棘手方式來冒犯每個人。 –

哦，woops ...對不起，我正在發泄我的挫折與這些警報...我想我改變他們，然後我上傳到這裏。 – Skelex

這裏的工作版本。

我做了兩個地方修復：

將返回false從提交處理程序，否則表單提交，並刷新自身
提交按鈕應該是類型=「提交」，否則處理程序將不叫

<!doctype html> 
 
<html> 
 
<head> 
 
<meta charset="utf-8"> 
 
<title>Luther Automotive Display Ad Login</title> 
 
<style type="text/css"> 
 
body { 
 
    background-image: url(IMAGES/bgTile.png); 
 
    background-repeat: repeat; 
 
    position: absolute; 
 
    width: 100%; 
 
    height: 100%; 
 
} 
 
.pageFrame { 
 
    padding: 0px; 
 
    height: 797px; 
 
    width: 1809px; 
 
    overflow: hidden; 
 
    position: absolute; 
 
    z-index: 1; 
 
} 
 
.lutherLogo { 
 
    position: absolute; 
 
    background-image: url(IMAGES/lutherLogo.png); 
 
    background-repeat: no-repeat; 
 
    background-position: 50% 50%; 
 
    width: 117px; 
 
    height: 72px; 
 
    top: 45%; 
 
    left: 50%; 
 
    margin-left: -58.5px; 
 
    margin-top: -36px; 
 
} 
 
.loginForm { 
 
    position: absolute; 
 
    top: 45%; 
 
    left: 50%; 
 
    width: 211px; 
 
    height: 74px; 
 
    text-align: center; 
 
    margin-left: -105.5px; 
 
    margin-top: 42px; 
 
    font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif; 
 
    color: #FFFFFF; 
 
    line-height: 21px; 
 
    margin-bottom: 5px; 
 
    z-index: 2; 
 
} 
 
.submitButton { 
 
    margin-top: 5px; 
 
} 
 
</style> 
 
</head> 
 
<script type="text/javascript"> 
 
<!-- 
 
function runLogin(form) { 
 
    var login = form.dealerID.value; 
 
    switch(login) { 
 
     case "1": 
 
     loadDealer("0"); 
 
      break; 
 
     case "2": 
 
      alert("foo"); 
 
      break; 
 
     case "3": 
 
      alert("bar"); 
 
      break; 
 
     default: 
 
      alert("foo bar"); 
 
      break; 
 
    } 
 
    return false; 
 
} 
 

 
var dealershipsArray = [ 
 
"NULL_IMAGES/filmstripNull.html" 
 
]; 
 

 
function loadDealer(i) { 
 
    var dealership = document.getElementById("dealerContainer"); 
 
    dealership.src = dealershipsArray[i]; 
 
} 
 
//--> 
 
</script> 
 

 
<body> 
 
<iframe id="dealerContainer" class="pageFrame" scrolling="no" frameborder="0" seamless></iframe> 
 
<div class="lutherLogo"></div> 
 
<div id="loginBox" class="loginForm"><form name="myForm" onsubmit="runLogin(this)"> 
 
    Please Enter Your Dealer Display Code<br> 
 
     <input type=TEXT value="" name="dealerID"> 
 
     <div class="submitButton"><input type="submit" value="Submit" name="myButton"></div> 
 
    </form> 
 
</div> 
 
</body> 
 
</html>

來源

2015-06-19 18:14:51 roxxypoxxy

非常感謝您的幫助！我對JavaScript仍然很陌生，但是我是辦公室裏唯一知道這些項目的人，只是最終落在了我的腿上。此外，對於這些提醒感到抱歉，我泄露了一些挫折感，而且儘管在上傳之前我已經更改了它們，但我想我已經忘記了。 – Skelex

Javascript - 使用開關更改iframe src

回答

相關問題