[英]enable and disable using selectbox change
I don't know how to enable and disable a text field using select box option. 我不知道如何使用选择框选项启用和禁用文本字段。
Maybe I wrote this totally wrong in the code below. 也许我在下面的代码中写了这完全错误的代码。 If I did, please tell me correct code.
如果我这样做了,请告诉我正确的代码。
<body>
<table width="500" border="1">
<form style="text-align:center" id="form1" name="form1" method="post" action="">
<tr>
<th width="32" nowrap="nowrap">Status</th>
<th width="32" nowrap="nowrap">Runs</th>
<th width="16" nowrap="nowrap">6</th>
</tr>
<?php
$('#Status1').change(function(){
var theVal = $('#Status1').val();
switch(theVal){
case'0':
$('#Runs1').prop('disabled', true);
break;
case'1':
$('#Runs1').prop('disabled', false);
break;
case'2':
$('#Runs1').prop('disabled', true);
break;
}
});
?>
<tr>
<td align='center'>
<select id='Status1'><option value='0'>Not Playing</option><option value='1'>Playing</option><option value='2'>Out</option></select></td>
<td align='center'>
<input style='font-weight:bold; background:#FFFFFF; text-align:right; color:#000000;' disabled='disabled' name='Runs1' type='text' id='Runs1' size='5' maxlength='5' value='' />
</td>
</tr>
</form>
</table>
</body>
The code for enabling/disabling the #Run1 input box is nested between PHP tags (server side), but this code is written in javascipt (client-side). 用于启用/禁用#Run1输入框的代码嵌套在PHP标记之间(服务器端),但是此代码是用javascipt(客户端)编写的。
<body>
<table width="500" border="1">
<form style="text-align:center" id="form1" name="form1" method="post" action="">
<tr>
<th width="32" nowrap="nowrap">Status</th>
<th width="32" nowrap="nowrap">Runs</th>
<th width="16" nowrap="nowrap">6</th>
</tr>
<script type="text/javascript">
$('#Status1').change(function(){
var theVal = $('#Status1').val();
switch(theVal){
case'0':
$('#Runs1').prop('disabled', true);
break;
case'1':
$('#Runs1').prop('disabled', false);
break;
case'2':
$('#Runs1').prop('disabled', true);
break;
}
});
</script>
<tr>
<td align='center'>
<select id='Status1'><option value='0'>Not Playing</option><option value='1'>Playing</option><option value='2'>Out</option></select></td>
<td align='center'>
<input style='font-weight:bold; background:#FFFFFF; text-align:right; color:#000000;' disabled='disabled' name='Runs1' type='text' id='Runs1' size='5' maxlength='5' value='' />
</td>
</tr>
</form>
</table>
Replace <?php
with <script>
and ?>
with </script>.
将
<?php
替换为<script>
,将?>
替换为</script>.
Rest all the thing is fine. 休息,一切都很好。
The code you wrote in php tags is a Jquery code, so it should be under script tags. 您在php标记中编写的代码是一个Jquery代码,因此应在脚本标记下。
load jquery in your <head>
and add the javascript there.. not inside <?php
(php code) 在
<head>
加载jquery并在其中添加javascript ..不在<?php
(php代码)内
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$('#Status1').change(function(){
var theVal = $('#Status1').val();
switch(theVal){
case'0':
$('#Runs1').prop('disabled', true);
break;
case'1':
$('#Runs1').prop('disabled', false);
break;
case'2':
$('#Runs1').prop('disabled', true);
break;
}
});
</script>
<body>
....//rest of your code
You have not included the jquery file and used tags instead of for the javascript code 您尚未包括jquery文件和使用标签,而不是javascript代码
<body>
<table width="500" border="1">
<form style="text-align:center" id="form1" name="form1" method="post" action="">
<tr>
<th width="32" nowrap="nowrap">Status</th>
<th width="32" nowrap="nowrap">Runs</th>
<th width="16" nowrap="nowrap">6</th>
</tr>
<script src="../jquery.js"></script>
<script type="text/javascript">
$('#Status1').change(function(){
var theVal = $('#Status1').val();
switch(theVal){
case'0':
$('#Runs1').prop('disabled', true);
break;
case'1':
$('#Runs1').prop('disabled', false);
break;
case'2':
$('#Runs1').prop('disabled', true);
break;
}
});
</script>
<tr>
<td align='center'>
<select id='Status1'><option value='0'>Not Playing</option><option value='1'>Playing</option><option value='2'>Out</option></select></td>
<td align='center'>
<input style='font-weight:bold; background:#FFFFFF; text-align:right; color:#000000;' disabled='disabled' name='Runs1' type='text' id='Runs1' size='5' maxlength='5' value='' />
</td>
</tr>
</form>
</table>
</body>
Try it like: 像这样尝试:
HTML 的HTML
<body>
<table width="500" border="1">
<form style="text-align:center" id="form1" name="form1" method="post" action="">
<tr>
<th width="32" nowrap="nowrap">Status</th>
<th width="32" nowrap="nowrap">Runs</th>
<th width="16" nowrap="nowrap">6</th>
</tr>
<tr>
<td align='center'>
<select id='Status1'><option value='0'>Not Playing</option><option value='1'>Playing</option><option value='2'>Out</option></select></td>
<td align='center'>
<input style='font-weight:bold; background:#FFFFFF; text-align:right; color:#000000;' disabled='disabled' name='Runs1' type='text' id='Runs1' size='5' maxlength='5' value='' />
</td>
</tr>
</form>
</table>
</body>
SCRIPT 脚本
<script type="text/javascript">
$(document).ready(function(){
$('#Status1').change(function(){
var theVal = $('#Status1').val();
switch(theVal){
case'0':
$('#Runs1').prop('disabled', true);
break;
case'1':
$('#Runs1').prop('disabled', false);
break;
case'2':
$('#Runs1').prop('disabled', true);
break;
}
});
});
</script>
But first check you have added a jquery library file
in the head section
. 但是首先检查您是否在
head section
添加了一个jquery library file
。
friends this is solution of my question with the help of you people thanks. 朋友们,这是我的问题的解决方案,谢谢大家的帮助。
<html>
<head>
<script type="text/javascript" src="../jquery.min.js"></script>
<SCRIPT LANGUAGE="JavaScript">
$(document).ready(function(){
$('#Status1').change(function(){
var theVal = $('#Status1').val();
switch(theVal){
case'0':
$('#Runs1').prop('disabled', true);
break;
case'1':
$('#Runs1').prop('disabled', false);
break;
case'2':
$('#Runs1').prop('disabled', true);
break;
}
});
});
</script>
</head>
<body>
<table width="500" border="1">
<form style="text-align:center" id="form1" name="form1" method="post" action="">
<tr>
<th width="32" nowrap="nowrap">Status</th>
<th width="32" nowrap="nowrap">Runs</th>
<th width="16" nowrap="nowrap">6</th>
</tr>
<tr>
<td align='center'>
<select id='Status1'><option value='0'>Not Playing</option><option value='1'>Playing</option><option value='2'>Out</option></select></td>
<td align='center'>
<input style='font-weight:bold; background:#FFFFFF; text-align:right; color:#000000;' disabled='disabled' name='Runs1' type='text' id='Runs1' size='5' maxlength='5' value='' />
</td>
</tr>
</form>
</table>
</body>
</html>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.