2

同様の質問が投稿されているのを見て、ニーズに合わせて変更しようとしましたが、それを行うための JavaScript について十分に知りません。私がやりたいのは、検索オプションとして「状態」を選択した場合、フォーム入力を 2 文字に制限することだけです。これは私が持っているものです:

function changeValue(){
var option=document.getElementById('searchtype').id;

if (option == ("A") || ("B") ){
document.getElementById('field').size="40";
}
else if(option=="C"){
document.getElementById('field').size="2";


<form action="results.php" method="post">
Search By:<br />
<select id="searchtype" name="searchtype" onchange="changeValue();">
<option id="A" value="name">Hospital Name<br /></option>
<option id="B" value="city">City</option>
<option id="C" value="state">State</option>
</select>
<br /><br />
Search:<br />
<input id="field" name="searchterm" type="text" size="0">

私は何か間違ったことをしていますか、それともこれを行うためのより良い方法はありますか?

以下のジャックのコードを使用し、field.size 属性を追加して、入力が最大許容文字数と一致するようにしました: (ジャックに感謝)

script type="text/javascript">
function changeValue(dropdown) {
var option = dropdown.options[dropdown.selectedIndex].value,
field = document.getElementById('field');

if (option == 'name' || option == 'city') {
    field.maxLength = 40;
            field.size = 40;
} else if (option == 'state') {
    field.value = field.value.substr(0, 2); 
    field.maxLength = 2;
            field.size = 2;
}
}       
</script>

            <h1>Hospital Search</h1>
    <form action="results.php" method="post">
    Search By:<br />
    <select id="searchtype" name="searchtype" onchange="changeValue(this);">
    <option id="name" value="name">Hospital Name<br /></option>
    <option id="city" value="city">City</option>
    <option id="state" value="state">State</option>
    </select><br />
    Search:<br />
    <input id="field" name="field" type="text" size="40">
    </input>

状態のリストを含むドロップダウンの方が良いと判断した後、これを次のように変更しました。

<form action="results.php" method="post">
      Hospital Name:<br />
      <input name="searchterm_name" type="text" size="40">
      <br />
      <input type="submit" name="submit" value="Search">
      </form><br />
        <form action="results.php" method="get">
        City Name:<br />
        <input name="searchterm_city" type="text" size="40"><br />
        <select name="select_state">
        <option value="">None
        <option value="AL" Selected>Alabama
        <option value="AK">Alaska
        <option value="AZ">Arizona
                    </SELECT>
        <input type="submit" name="submit" value="Search">
      </form>

ED: フォーム メソッド "post" を使用すると、戻るボタンを押して結果ページに移動するたびに、ブラウザーが警告をスローしました。情報は機密ではないため、「取得」に変更しましたが、警告なしで元に戻ります。

4

3 に答える 3

1

プロパティを設定しmaxlengthます。

document.getElementById('field').maxlength = 2;

コードの残りの部分が機能しない可能性が高いことに気付きました。

function changeValue(dropdown) {
    var option = dropdown.options[dropdown.selectedIndex].value,
    field = document.getElementById('field');

    if (option == 'name' || option == 'city') {
        field.maxLength = 40;
    } else if (option == 'state') {
        field.value = field.value.substr(0, 2); // before reducing the maxlength, make sure it contains at most two characters; you could also reset the value altogether
        field.maxLength = 2;
    }
}​

次に、HTML で:

<select id="searchtype" name="searchtype" onchange="changeValue(this);">
于 2012-05-29T04:57:51.453 に答える
0

これを試して

function changeValue() {
    var option2 = document.getElementById('searchtype').options[document.getElementById('searchtype').selectedIndex].id;
    if (option2 == ("A") || option2 == ("B")) {
        document.getElementById('field').size = "40";
    }
    else if (option2 == "C") {
        document.getElementById('field').size = "2";
    }
}​
于 2012-05-29T05:02:16.773 に答える
-1

これを試して。

document.getElementById('field').setAttribute('size', "10");
于 2012-05-29T05:05:37.013 に答える