-1
點擊現在嘗試後。
- 一個奇特的盒子應該打開名稱和密碼。
- 如果這兩個字段都是空白的,我點擊登錄,它應該顯示錯誤 消息。
- 如果我輸入名稱和密碼,它應該在fancybox中顯示相同的內容。
對於我的代碼低於第二和第三點是行不通的。我的代碼有什麼問題?
<html>
<head>
<link rel="stylesheet" type="text/css" href="fancybox-master/dist/jquery.fancybox.min.css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="fancybox-master/dist/jquery.fancybox.min.js"></script>
<script type = "text/javascript">
$("#tip5").fancybox({
'scrolling' : 'no',
'titleShow' : false,
'onClosed' : function() {
$("#login_error").hide();
}
});
</script>
<script>
$("#login_form").on("submit", function() {
if ($("#login_name").val().length < 1 ||
$("#login_pass").val().length < 1) {
$("#login_error").show();
$.fancybox.resize();
return false;
}
$.fancybox.showActivity();
$.ajax({
type : "POST",
cache : false,
url : "/data/login.php",
data : $(this).serializeArray(),
success: function(data) {
$.fancybox(data);
}
});
return false;
});
</script>
</head>
<body>
<a data-fancybox id="tip5" title="Login" href="#login_form">Try now</a>
<div style="display:none">
<form id="login_form" method="post" action="">
<p id="login_error">Please, enter data</p>
<p>
<label for="login_name">Login: </label>
<input type="text" id="login_name" name="login_name" size="30" />
</p>
<p>
<label for="login_pass">Password: </label>
<input type="password" id="login_pass" name="login_pass" size="30" />
</p>
<p>
<input type="submit" value="Login" />
</p>
<p>
<em>Leave empty so see resizing</em>
</p>
</form>
</div>
</body>
</html>
感謝您的回覆, 我嘗試$( 「#login_form輸入[類型= '提交']」)。在( 「點擊」,函數( ){而不是$(「#login_form」)。on(「submit」,function(){ ,但效果是一樣的 如果可能的話,請嘗試在你的最後並讓我知道 – Krishna
http:// jsfiddle。 net/vdffkrLo/ fancybox 3被使用 – lijnam
我試過了你在jsfiddle中提到的上面的代碼,但沒有什麼好玩的點擊提交按鈕。 嘗試過的瀏覽器是鉻和邊緣。 爲什麼你還沒有輸入第一個腳本($(「#tip5」)。fancybox({)在你寫的代碼中jsfiddle – Krishna