我应该组成一个有更多包的页面。首先;访问者必须选择个人号码,选择"开始"按钮后将启用,当访问者按下按钮时,使用get方法重定向到form4.html。当我放入3个表单时,所有表单都会影响其他表单。请帮助我
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.4.2.js'></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/jquery-ui.js"></script>
<!----Drop Down And Submit - Start----->
<script type='text/javascript'>//<![CDATA[
$(function(){
$(document).ready(function() {
//Start Buttons
$(".nextbutton").button({ disabled: true });
$('.dropdown').change(function() {
if ($('.dropdown').val() == 0) {
$(".nextbutton").button({ disabled: true });
} else {
$(".nextbutton").button({ disabled: false });
}
});
});
});//]]>
</script>
<!----Drop Down And Submit - End----->
<script type="text/javascript">
function submitform()
{
document.forms["drop_list"].submit();
}
</script>
</head>
<body>
<h3>PACKAGE - 1 </h3>
<form name="drop_list" action="../../form/form4.html" method="get" class="j-forms j-multistep">
<form name="drop_list" action="../../form/form4.html" method="get" class="j-forms j-multistep">
<select name="select" class="dropdown">
<option value=''>Person Number</option>
<option value="Person-1">1</option>
<option value="Person-2">2</option>
<option value="Person-3">3</option>
<option value="Person-4">4</option>
<option value="Person-5">5</option>
<option value="Person-6">6</option>
<option value="Person-7">7</option>
<option value="Person-8">8</option>
<option value="Person-9">9</option>
</select><br><br>
<input class="nextbutton" value="Start" type="button" onClick="submitform()"></form>
<br>_____________________________________________________________________<br>
<h3>PACKAGE - 2 </h3>
<form name="drop_list" action="../../form/form4.html" method="get" class="j-forms j-multistep">
<select name="select" class="dropdown">
<option value=''>Person Number</option>
<option value="Person-1">1</option>
<option value="Person-2">2</option>
<option value="Person-3">3</option>
<option value="Person-4">4</option>
<option value="Person-5">5</option>
<option value="Person-6">6</option>
<option value="Person-7">7</option>
<option value="Person-8">8</option>
<option value="Person-9">9</option>
</select><br><br>
<input class="nextbutton" value="Start" type="button" onClick="submitform()"></form>
<br>_____________________________________________________________________<br>
<h3>PACKAGE - 3 </h3>
<form name="drop_list" action="../../form/form4.html" method="get" class="j-forms j-multistep">
<select name="select" class="dropdown">
<option value=''>Person Number</option>
<option value="Person-1">1</option>
<option value="Person-2">2</option>
<option value="Person-3">3</option>
<option value="Person-4">4</option>
<option value="Person-5">5</option>
<option value="Person-6">6</option>
<option value="Person-7">7</option>
<option value="Person-8">8</option>
<option value="Person-9">9</option>
</select><br><br>
<input class="nextbutton" value="Start" type="button" onClick="submitform()"></form>
</body>
</html>
正如我在对您的问题的评论中所说,您的问题之一是您实际上同时更改了class.nextbutton的所有按钮。
您可以将更改功能更改为
$('.dropdown').change(function() {
$(this.form).find('.nextbutton').button({ disabled: this.value === '' });
});
它所做的是使用这个,它是触发函数的元素。通过使用this.form,我得到了那个元素的形式。然后我只更改当前表单上的按钮。
我还去掉了if-语句,因为这是一个布尔表达式,禁用的属性也是一个布尔值。