爲什麼我的視圖更新時，我有我的功能警報但是當我做不不

，所以我有一個HTML頁面調用的index.html，它看起來像：爲什麼我的視圖更新時，我有我的功能警報但是當我做不不

<!DOCTYPE html> 
<html> 
<head> 
<script src="http://code.jquery.com/jquery-latest.js"></script> 
<title>sometitle</title> 
<link rel="stylesheet" href="style.css" /> 

</head> 
<body> 
<div id="Screen"> 
<section class="loginform cf"> 
    <form action="#" method="post" id="loginwindow"> 
     <ul> 
      <li> 
       <label for="usermail">Email</label> 
       <input type="email" name="useremail" placeholder="[email protected]" required> 
      </li> 
      <li> 
       <label for"password">Password</label> 
       <input type="password" name="password" placeholder="password" required> 
      </li> 
      <li> 
       <input type="submit" value="Check In"> 
      </li> 
     </ul> 
    </form> 
</section> 

<script src="js/index.js"></script> 
</div> 
</body> 
</html>

，它有一個js文件名爲index.js看起來像這樣：

window.onload = function() { 
var loginForm = document.getElementById('loginwindow'); 
if (loginwindow) { 
    loginwindow.onsubmit = function() { 
     var useremail = document.getElementById('useremail'); 
     var password = document.getElementById('password'); 

     // Make sure javascript found the nodes: 
     if (!useremail || !password) {  
      load("LoopIt_DashBoard.html"); 
      return "success"; 
     } 

    } 
} 
} 

function load(url) 
{ 

$("#Screen").load(url, function(response, status, xhr) { 
if (status == "error") { 
var msg = "Sorry but there was an error: "; 
$("#error").html(msg + xhr.status + " " + xhr.statusText); 
} 
}); 
test(); 

} 

function test() 
{ 

alert("test"); 

} 
function test(string) 
{ 

alert(string); 

}

，並呼籲LoopIt_DashBoard.html第二HTML文件看起來像這樣：

<div id="Screen"> 
<section class="loginform cf"> 
    <form action="#" method="post" id="loginwindow"> 
     <ul> 
      <li> 
       <input type="submit" value="Check In"> 
      </li> 
     </ul> 
    </form> 
</section> 
</div>

現在這個代碼所做的就是獲得一封電子郵件和一個密碼，然後比較兩者。如果它們相等，那麼它將使用LoopIt_DashBoard.html文件中的代碼以id Screen更改div中的html。但是，如果我拿出這只是調用警報（我用它測試）

test();

從

function load(url) 
{ 

$("#Screen").load(url, function(response, status, xhr) { 
if (status == "error") { 
var msg = "Sorry but there was an error: "; 
$("#error").html(msg + xhr.status + " " + xhr.statusText); 
} 
}); 
test(); 

}

那麼這個功能不起作用線，頁面不會改變。如何讓我的視圖更新而不使用警報。

來源

2013-01-24 WilliamFM

嘗試使用返回true或返回false（根據您的要求），而不是測試（） –

也許無關緊要，但是在您的onload中，您設置了loginForm，然後測試了loginwindow。另外，「測試」的兩個定義並不按我想要的方式工作。第二個重新定義第一個（寫在它上面）。 – DrC

如果這是不應該工作的原代碼，因爲你剛纔設置的名稱屬性：

HTML

... 

<input type="email" name="useremail" placeholder="[email protected]" required> 

...

的Javascript

... 
var useremail = document.getElementById('useremail'); //but you just set the Name Attribute 
...

除了一些不乾淨的代碼，它似乎精細。

我也要清理代碼有點，例如：

window.onload = function() { 
var loginForm = $('#loginwindow')[0]; 
if (loginwindow) { 
    loginwindow.onsubmit = function() { 
     var useremail = $('#useremail')[0]; 
     var password = $('password')[0]; 
     // Make sure javascript found the nodes: 
     if (useremail && password) {  
      load("LoopIt_DashBoard.html"); 
      return "success"; 
     } 

    } 
    } 
} 

...

重要這些功能互相覆蓋，因爲它們具有相同的名稱

function test() 
{ 
    alert("test"); 
} 

function test(string) 
{ 
    alert(string); 
}

TIP如果這不是原來的代碼，檢查/計數braches捲曲和正常。這可以解釋這個奇怪的現象。

來源

2013-01-24 07:42:45

謝謝，我意識到javascript發佈後不久就會覆蓋，這是我第一次真正嘗試使用html和java腳本。 – WilliamFM

您也在製作錯字...
它應該是loginFrom中的if語句而不是loginWindow。

var loginForm = document.getElementById('loginwindow'); 
     if (loginForm)

來源

2013-01-24 08:20:16

alert將暫停JavaScript函數的執行，允許任何其他JavaScript的事件處理接管觸發，導致當前的事件處理的情況下丟失。

沒有警報，您load()會被人遺忘，因爲你的onsubmit事件處理程序將正常返回，並允許貼在表格的數據，基本上是刷新頁面，儘管該行動"#"，因爲它是一個POST。因此，您的視圖可能正在更新，但是，文檔也正在重新加載，因此看起來不是。

如果您自己處理，則需要取消表格的onsubmit()。一種方法是返回false而不是"success"。

來源

2013-01-24 08:58:14

Great Catch沒有注意到缺少'return false;' –

爲什麼我的視圖更新時，我有我的功能警報但是當我做不不

回答

相關問題