我有这个代码根据选择产生某种形式。
$(document).ready(function(){
$('#dealerform').hide();
$('#customerform').hide();
$('#select').change(function(){
$('#dealerform,#customerform').hide();
$($(this).find('option:selected').attr('value')).show();
});
});
$(document).ready(function(){
$("input[name='emailquest']").change(function(){
if (this.value != "1") { // <----I would probably change this to look for this.checked
$("input[name='email']").prop("disabled", true);
} else {
$("input[name='email']").prop("disabled", false);
}
});
});
现在我添加了一些代码来尝试添加一个datepicker以及这个代码,现在它打破了我以前的代码,只是立即提供整个事情而且datepicker不起作用。有人知道我在这里做错了什么并且有可能的日期选择器解决方案吗?
$(function(){
$("#datepicker").datepicker();
});
由于
答案 0 :(得分:3)
没有必要将每个代码块包装在一个新的$(document.ready()。
中此:
$(document).ready(function(){
$('#dealerform').hide();
$('#customerform').hide();
$('#select').change(function(){
$('#dealerform,#customerform').hide();
$($(this).find('option:selected').attr('value')).show();
});
});
$(document).ready(function(){
$("input[name='emailquest']").change(function(){
if (this.value != "1") { // <----I would probably change this to look for this.checked
$("input[name='email']").prop("disabled", true);
} else {
$("input[name='email']").prop("disabled", false);
}
});
});
$(function(){
$("#datepicker").datepicker();
});
可以这样写:
$(function() {
// your first block of code
$('#dealerform').hide();
$('#customerform').hide();
$('#select').change(function(){
$('#dealerform,#customerform').hide();
$($(this).find('option:selected').attr('value')).show();
});
// your second block of code
$("input[name='emailquest']").change(function(){
if (this.value != "1") { // <----I would probably change this to look for this.checked
$("input[name='email']").prop("disabled", true);
}
else {
$("input[name='email']").prop("disabled", false);
}
});
// that last piece
$("#datepicker").datepicker();
})
请记住,如果你同时使用jQuery和jQueryUI(datepicker来自jQueryUI),那么你必须引用这两个库,如下所示:
<html>
<head>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/smoothness/jquery-ui.min.css" type="text/css" media="all" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<script type="text/javascript">
$(function() {
// your first block of code
$('#dealerform').hide();
$('#customerform').hide();
$('#select').change(function(){
$('#dealerform,#customerform').hide();
$($(this).find('option:selected').attr('value')).show();
});
// your second block of code
$("input[name='emailquest']").change(function(){
if (this.value != "1") { // <----I would probably change this to look for this.checked
$("input[name='email']").prop("disabled", true);
}
else {
$("input[name='email']").prop("disabled", false);
}
});
// that last piece
$("#datepicker").datepicker();
})
</script>
</head>
答案 1 :(得分:0)
$(function() {
$("#datepicker").datepicker();
$('#dealerform').hide();
$('#customerform').hide();
$('#select').change(function(){
$('#dealerform,#customerform').hide();
$($(this).find('option:selected').attr('value')).show();
});
$("input[name='emailquest']").change(function(){
if (this.value != "1") { // <----I would probably change this to look for this.checked
$("input[name='email']").prop("disabled", true);
} else {
$("input[name='email']").prop("disabled", false);
}
});
});