|
查看: 829|回复: 3
|
关于ajax或javascript的问题！
[复制链接]
|
|
|
<select>
<option> 8:30am</option>
<option> 1:00pm</option>
</select>
<select>
<option> 12:00pm</option>
<option> 5:00pm</option>
</select>
假设我的网页有两个select的tag!
请问怎样做到如果我选择1:00pm，然后第二个select的tag只出现5:00pm，12：00pm就不会出现？
有办法做到的吗？ |
|
|
|
|
|
|
|
|
|
|
|
发表于 27-10-2008 08:06 AM
|
显示全部楼层
原帖由 ahjing 于 24-10-2008 09:55 PM 发表 
8:30am
1:00pm
12:00pm
5:00pm
假设我的网页有两个select的tag!
请问怎样做到如果我选择1:00pm，然后第二个select的tag只出现5:00pm，12：00pm就不会出现？
有办法做到的吗？
可以啊。你的第一个的select要加上OnChange event，然后用Ajax重写第二个select的内容，大致上是这样：
<select >
<option>8.30am</option>
<option>1.00pm</option>
</select>
<div id="selectNo2"> <-给它一个ID方便重写
<select>
<option>12.00pm</option>
<option>5.00pm</option>
<select>
</div>
大概是这样。再不懂我才把JS写出来吧。 |
|
|
|
|
|
|
|
|
|
|
|
楼主 |
发表于 27-10-2008 01:11 PM
|
显示全部楼层
回复 2# seikan 的帖子
function ValidateForms(){
var x=new Date();
var y = document.frmSample.dateTo.value;
var z = document.frmSample.dayoffid.value;
result = y.split("-");
x.setDate(result[2]);
x.setMonth(result[1]-1);
x.setFullYear(result[0]);
s=x.toDateString()
s=s.substring(0,3)
if( s == 'Sat' && z ==3)
{
alert("Your selected date is Holidays!")
return false;
}
if( s == 'Sat') {
document.getElementById('firstone').style.display = 'inline';
document.getElementById('secondone').style.display = 'none';
}
}
<html>...
<form name="frmSample" ACTION = commit_leave.php METHOD = POST action="" onSubmit="return ValidateForm() && ValidateForms()">
Date To:
<input id="exampleII" name="dateTo" type="text" style="width: 115px;" maxlength="10" />
<select name="Fromhour" id="firstone">
<option value="7:30">7:30am</option>
<option value="12:30">12:30am</option>
</select>
<select name="Tohour" id="secondone">
<option value="11:30">11:30am</option>
<option value="16:30">4:30am</option>
</select>
<input src="apply.gif" name="submit" type="image" />
...</html>
现在我想要做的是，当我的input收到一个date之后，然后验证是否星期六，如果是星期六，就显示第二个select option,但是我以上的code要按submit才会work!!要怎样做到还没按submit就已经work了！ |
|
|
|
|
|
|
|
|
|
|
|
发表于 27-10-2008 08:20 PM
|
显示全部楼层
回复 1# ahjing 的帖子
Solution 1 : Full Html Code
Copy and paste into notepad, save as *.html and try it
<html>
<head><title></title>
<script language="javascript">
var removeIndex = -1;
function RemoveOption(ctrl)
{
var secondCtrl=document.getElementById("SecondSelect");
if (ctrl.options[ctrl.selectedIndex].text == '1.00pm')
{
for(var i=0; i<secondCtrl.length;i++)
{
if(secondCtrl.options.text == '12.00pm')
{
secondCtrl.remove(i);
removeIndex = i;
}
}
}
else
{
var bExist = false;
for(var i=0; i<secondCtrl.length;i++)
{
if(secondCtrl.options.text == '12.00pm')
{ bExist = true; }
}
if (!bExist)
{
var NewOption =document.createElement('option');
NewOption.text= '12.00pm'
try
{ secondCtrl.add(NewOption , removeIndex ); }
catch(ex)
{ secondCtrl.add(NewOption); }
}
}
}
</script>
</head>
<body>
<form>
<div>
<select >
<option>8.30am</option>
<option>1.00pm</option>
</select>
<select id="SecondSelect">
<option>12.00pm</option>
<option>5.00pm</option>
</select>
</div>
</form>
</body>
</html>
Note: On the first select tag please add onchange event and call RemoveOption function like below :
RemoveOption(this);
Because of forum text editor was filter my call function
Thus, you need to add by yourself, otherwise it is look like not work.
Thank you.
[ 本帖最后由 sc85 于 27-10-2008 08:47 PM 编辑 ] |
|
|
|
|
|
|
|
|
|
| |
 本周最热论坛帖子
|
变色卡
千斤顶
2117 
49
