0
我的代碼：超出範圍的變量？
<html>
<head>
<script type="text/JavaScript" src="jquery-1.3.2.min.js"></script>
<script type="text/JavaScript" src="jquery.center.js"></script>
<script type="text/JavaScript">
$(document).ready(function(){
$('a').click(function(){
popup_AskYN("Want me to tell you what 1 + 1 is?",function(){
//popup_Info("It's 2, silly!");
},function(){
//popup_Info("I didn't want to, anyway!");
});
});
});
function popup_AskYN(msg,yes_fn,no_fn){
$('body').append("<div id='popup'><p>"+msg+"</p><a id='popup_yes' href='#'>Yes!</a><a href='#' id='popup_no'>No.</a></div>");
var yes_button = $('#popup_yes:last');
var no_button = $('#popup_no:last');
var popup = $('#popup:last');
popup.center();
yes_button.click(yes_fn);
no_button.click(no_fn);
yes_button.click(function(){
popup.fadeOut('fast').remove();
});
no_button.click(function(){
popup.fadeOut('fast').remove();
});
}
function popup_Info(msg,callback){
$('body').append("<div id='popup'><p>"+msg+"</p><a id='popup_ok' href='#'>Ok.</a></div>");
var ok_button = $('#popup_ok:last');
var popup = $('#popup:last');
popup.center();
ok_button.click(callback);
ok_button.click(function(){
popup.fadeOut('fast',function(){ $(self).remove(); });
});
}
</script>
<style type="text/css">
#popup {
position:absolute;
border:1px solid black;
}
#popup a {
margin:10px;
}
</style>
</head>
<body>
<a href="#">Launch the popup!</a>
</body>
現在這個工程well..except時，我有一個以上的彈出窗口。我縮小到的是什麼時候 - 我創建了一個新的彈出窗口，它改變了yes_button，no_button，ok_button和popup的值。所以當前面的彈出窗口嘗試使用這些變量時，它們都指向新的彈出窗口而不是當前的彈出窗口。因爲所有彈出窗口都有相同的ID，所以我沒有任何「唯一」來標識每個窗口。我想簡單地存儲選擇器就足夠了，但那不起作用。我能在這裏做什麼？
編輯，添加適當的ID，但仍然沒有工作...：
<html>
<head>
<title>Call backs</title>
<script type="text/JavaScript" src="jquery-1.3.2.min.js"></script>
<script type="text/JavaScript" src="jquery.center.js"></script>
<script type="text/JavaScript">
$(document).ready(function(){
$('a').click(function(){
popup_AskYN("Want me to tell you what 1 + 1 is?",function(){
//popup_Info("It's 2, silly!");
},function(){
//popup_Info("I didn't want to, anyway!");
});
});
});
var popup_AskYNId = 0;
var popup_InfoId = 0;
function popup_AskYN(msg,yes_fn,no_fn){
popup_AskYNId = popup_AskYNId + 1;
$('body').append("<div class='popup' id='"+popup_AskYNId+"popup_AskYN'><div class='popup_inner'><p>"+msg+"</p></div><div class='popup_options'><a class='popup_yes' id='"+popup_AskYNId+"popup_yes_AskYN' href='#'>Yes!</a><a href='#' class='popup_no' id='"+popup_AskYNId+"popup_no_AskYN' >No.</a></div></div>");
popup = $('#'+popup_AskYNId+'popup_AskYN');
yes_button = $('#'+popup_AskYNId+'popup_yes_AskYN');
no_button = $('#'+popup_AskYNId+'popup_no_AskYN');
popup.center();
yes_button.click(yes_fn);
no_button.click(no_fn);
yes_button.click(function(){
popup.fadeOut('fast').remove();
});
no_button.click(function(){
popup.fadeOut('fast').remove();
});
}
function popup_Info(msg,callback){
$('body').append("<div id='popup'><div id='popup_inner'><p>"+msg+"</p></div><div id='popup_options'><a id='popup_ok' href='#'>Ok.</a></div></div>");
ok_button = $('#popup_ok:last');
popup = $('#popup:last');
popup.center();
ok_button.click(callback);
ok_button.click(function(){
popup.fadeOut('fast',function(){ $(self).remove(); });
});
}
</script>
<style type="text/css">
.popup {
position:absolute;
border:1px solid black;
padding:3px;
}
.popup_inner {
border:1px solid black;
padding:10px;
}
.popup_options {
margin:0 auto;
}
.popup_options a {
border:1px solid black;
margin-top:3px;
margin-left:3px;
height:15px;
width:75px;
float:right;
text-align:center;
font-family:tahoma;
font-size:0.8em;
text-decoration:none;
line-height:14px;
}
</style>
</head>
<body>
<a href="#">Launch the popup!</a>
</body>
</html>
溶液發現，但是我修改了一點點，這樣yes和no受理功能，如老版本..
$(function() {
$('a').click(function(e) {
e.preventDefault();
var num1 = Math.floor(Math.random()*11),
num2 = Math.floor(Math.random()*11);
popup_AskYN(
"Want me to tell you what 1 + 1 is?",
function(){
$('body').append('its 2');
},function(){
$('body').append('Fine.');
});;
});
$('.popup_yes').live('click', function(e) {
e.preventDefault();
$(this).closest('.popup').fadeOut('fast', function() {
$(this).remove();
});
});
$('.popup_no').live('click', function(e) {
e.preventDefault();
$(this).closest('.popup').fadeOut('fast', function() {
$(this).remove();
});
});
});
function popup_AskYN(msg, yes, no){
$('body').append("<div class='popup'><div class='popup_inner'><p>"+msg+"</p></div><div class='popup_options'><a class='popup_yes' href='#'>Yes!</a><a href='#' class='popup_no'>No.</a></div></div>");
var yes_button = $('.popup_yes:last');
var no_button = $('.popup_no:last');
var popup = $('.popup:last');
yes_button.click(yes);
no_button.click(no);
}
ID如何不起作用？我究竟做錯了什麼？ – Prodigga 2010-01-09 21:56:04
我剛試過，同樣的問題仍然存在。我在彈出窗口打印出彈出窗口的ID，停止居中並將其放置在相對位置：相對的，它們被放置在不同的行中。不管我按哪個按鈕，最後一個彈出窗口，只有最後一個彈出窗口才會消失。 – Prodigga 2010-01-09 21:59:58
我將代碼添加到了我的原始答案中，以向您展示我的意思。使用ID不起作用，因爲正如slebetman指出的那樣，每個ID必須是唯一的。事實證明，這裏沒有必要使用ID，因此只需將它們更改爲類即可。 – 2010-01-10 00:33:18