我正在为此拉扯头发，希望有人可以提供帮助。我有动态插入页面的内容和 Javascript，它看起来像这样：
<script type="text/javascript">
$(document).ready(function(){
$("input#employee_id2").on("keyup", function(){
alert($(this).val());
});
$("button.signinbutton").on("click", function(e){
var empn = $("input#employee_id2").val();
var empc = $("input#cell2").val();
alert(empn);
alert(empc);
e.preventDefault();
// .. Some more stuff that is irrelevant.
});
});
</script>
第一个带有 keyup 的选择器只是用来显示输入中实际上有一个值，这 100% 有效，但是，当我在该脚本的第二部分中设置变量时，它们会警告空值。这怎么可能？
编辑：在我的代码中它不起作用，在我的小提琴中它起作用： //jsfiddle.net/bliksempie/Qs8BG/1/
出现此问题时生成页面的完整来源：
<!doctype html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>X</title>
<meta name="keywords" content="x,y,z" />
<meta name="description" content="X" />
<link rel="stylesheet" type="text/css" href="http://localhost/x/assets/js/bootstrap/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="http://localhost/x/assets/js/validationengine/validationEngine.jquery.css" />
<link rel="stylesheet" type="text/css" href="http://localhost/x/assets/js/sudoslider/css/style.css" />
<link rel="stylesheet" type="text/css" href="http://localhost/x/assets/js/sudoslider/css/lib/animate.min.css" />
<link rel="stylesheet" type="text/css" href="http://localhost/x/assets/css/styles.css" />
<link rel="stylesheet" type="text/css" href="http://localhost/x/assets/font-awesome/css/font-awesome.css" />
<link rel="stylesheet" type="text/css" href="http://localhost/x/assets/font-awesome/css/font-awesome-ie7.css" />
<script type="text/javascript" src="http://localhost/x/assets/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="http://localhost/x/assets/js/jquery.migrate.js"></script>
<script type="text/javascript" src="http://localhost/x/assets/js/validationengine/jquery.validationEngine.js"></script>
<script type="text/javascript" src="http://localhost/x/assets/js/validationengine/jquery.validationEngine-en.js"></script>
</head>
<body>
<a id="top"></a>
<div class="container-fluid">
<!-- Content -->
<div id="content" class="row-fluid">
<div class="wrap">
<div class="row-fluid">
<div class="span12">
<script type="text/javascript">
$(document).ready(function(){
var sudoSlider = $("#home-sudoslider").sudoSlider({
responsive: true,
prevNext: false,
numeric:false,
continuous:true,
customLink:'a.customlink'
});
});
</script>
<div class="home-sudo-container pad-top-20" style="position:relative;">
<div id="home-sudoslider">
<img src="http://localhost/x/assets/uploads/sudoslider/slide-1.jpg" alt="" />
<img src="http://localhost/x/assets/uploads/sudoslider/slide-2.jpg" alt="" />
<img src="http://localhost/x/assets/uploads/sudoslider/slide-3.jpg" alt="" />
<div class="signin-div">
<div class="row-fluid footer">
<div class="span6 offset6" style="margin-top: 25%">
<form action="http://localhost/x/signin-step-2" method="post" accept-charset="utf-8" id="signin-form-2" enctype="multipart/form-data">
Employee ID: <input type="text" name="employee_id2" value="" id="employee_id2" class="validate[required] input-xlarge" /><br />
Cellular number: <input type="text" name="cell2" value="" id="cell2" class="validate[required,min[10]|max[10]] input-xlarge" /><br />
<button name="submitbutton" type="button" id="submitbutton" class="signinbutton btn btn-success" value="" >Sign me in</button>
</form>
<p id="signin-result"></p>
</div>
</div>
<script type="text/javascript">
$(document).ready(function(){
$("input#employee_id2").on("keyup", function(e){
alert($(this).val());
});
$("button.signinbutton").on("click", function(e){
var empn = $("input#employee_id2").val();
var empc = $("input#cell2").val();
alert(empn);
alert(empc);
if (empc == "")
{
empc = "";
}
var url = encodeURI("http://localhost/x/signin/signin_submit/" + empn + "/" + empc);
$.ajax(url, {
success: function(response){
alert(response);
if (response == -1)
{
$("p#signin-result").html("<strong>Oops!</strong> You have to provide your employee number in order to sign in.");
$("p#signin-result").show("slow");
}
else if (response == 0)
{
$("p#signin-result").html("<strong>Oops!</strong> Unfortunately, your employee ID was not found on the system. Please contact X Y at <a href=\"mailto:x@x.y\">x@x.y</a>.");
$("p#signin-result").show("slow");
}
else if (response == 1)
{
window.location = "http://localhost/x/signin/check_and_redirect";
}
}
});
e.preventDefault();
});
});
</script>
</div>
</div>
<a rel="next" class="customlink home-next-button"></a>
<a rel="last" class="customlink home-final-button"></a>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="http://localhost/x/assets/js/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="http://localhost/x/assets/js/less/less-1.4.1.min.js"></script>
<script type="text/javascript" src="http://localhost/x/assets/js/sudoslider/js/jquery.sudoSlider.min.js"></script>
<script type="text/javascript" src="http://localhost/x/assets/js/sudoslider/js/lib/jquery.touchSwipe.js"></script>
</div>
</body>
</html>
EDIT2：当代码在滑块（Sudo Slider）内时，它会爆炸。当我将它移出滑块的包含 div 时，它可以工作:-) 我选择删除滑块，所以问题没有解决，但我至少解决了它......
提前致谢！