1

選択ボックス オプションを使用してテキスト フィールドを有効または無効にする方法がわかりません。

以下のコードでこれを完全に間違って書いたのかもしれません。もしそうなら、正しいコードを教えてください。

<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>
4

6 に答える 6

2

＃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>
于 2013-03-05T10:30:35.823 に答える
1

次のように試してください：

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 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>

ただし、最初に に を追加したことを確認jquery library fileしてくださいhead section。

于 2013-03-05T10:46:21.917 に答える
1

あなたにjqueryをロードし、<head>そこに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
于 2013-03-05T10:32:20.980 に答える
1

とRest に置き換えてください。すべて問題ありません<?php。<script>?></script>.

php タグに記述したコードは Jquery コードなので、script タグの下に配置する必要があります。

于 2013-03-05T10:28:12.957 に答える
1

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>
于 2013-03-05T10:33:43.860 に答える
0

友達のおかげで、これは私の質問の解決策です。

<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>
于 2013-03-05T11:18:21.083 に答える