1

URL にパラメーターを追加する HTML フォームがあります。同じフォームで特定のオプションが選択されている場合にのみ、追加のパラメーターを追加します。したがって、「Commercial」が選択されている場合、パラメーター「addedParameter=1」を URL に追加したいとします。そうでない場合、パラメーターをまったく表示したくありません (そうしないと、「House」と「Land」の結果が得られません)。 ") 私にできることを教えてください。

<select id="pt" value="pt" name="pt" onChange="addParameter()">
<option value="" name="">Select</option>
<option value="1" name="1">House</option>
<option value="2" name="2">Commercial</option>
<option value="3" name="3">Land</option>
</select>

<input type="hidden" id="add" name="" value="1">

function addParameter(){
if(pt.selectedIndex == 1)
document.getElementById("add").name = "addedParameter";
}
4

5 に答える 5

1

条件に基づいて要素を追加/削除するのではなく、代わりにdisabled属性を使用することをお勧めします (非disabled要素のみが「成功」と見なされるため、非disabled要素のみが名前/値を持つことになります)提出):

function addParameter () {
    var sel = document.getElementById('pt'),
        input = document.getElementById('add');
    input.disabled = sel.selectedIndex != 2;
}

document.getElementById('pt').onchange = addParameter;

JS フィドルのデモ。

type="hidden"デモでは、効果を視覚的に示すために属性値を削除しましたが、このアプローチが機能するためには必要ありません。また、条件inputにはdisabled="disabled"デフォルトで属性が設定されています (したがって、フォームがselectユーザーによって影響を受ける前に送信された場合でも、誤って送信されることはありません)。

于 2013-08-23T07:51:56.030 に答える
0

このような場合、フォームの送信イベントにイベント ハンドラーを追加するのが最善の方法だと思います。必要なことを行ってから、フォームを送信してください。入力を html に追加してから削除するのは、それほど柔軟ではありません。

<script>
    window.onload = function() {

        var form = document.getElementById("theform"),
            select = document.getElementById("pt");

        form.addEventListener("submit", function(event) {
            event.preventDefault();
            if(select.value == 2) {
                var element = document.createElement("INPUT");
                element.setAttribute("type", "hidden");
                element.setAttribute("name", "addedParameter");
                element.setAttribute("value", "1");
                form.appendChild(element);
            }
            form.submit();
        });

    }
</script>
<form method="get" id="theform">
    <select id="pt" value="pt" name="pt" onChange="addParameter()">
        <option value="" name="">Select</option>
        <option value="1" name="1">House</option>
        <option value="2" name="2">Commercial</option>
        <option value="3" name="3">Land</option>
    </select>
    <input type="submit" />
</form>
于 2013-08-23T07:33:16.323 に答える
0 
<input type="hidden" id="add" name="addedParameter" value="1">

function addParameter(){
if(pt.selectedIndex != 1)
  input = document.getElementById("add")
  parent = input.parentNode
  parent.removeChild(input)
}

additionalParameter が設定されていない場合、これにより入力が削除されます。それ以外の場合は変更されません。

編集:代替ソリューション:

function addParameter(){
    if(pt.selectedIndex == 1) {
        document.getElementById("add").name = "addedParameter";
    } else {
        document.getElementById("add").name = "";
    }
}

removeChildのドキュメントも参照してください

于 2013-08-23T07:21:41.037 に答える