0

このような div クラスがあり、テキスト ボックスに状態の値を設定する setlocation 関数を呼び出したい

<div class="overview over_widt">
    <ul>
        <li class="auto" title="All India"></li>
        {% for state_obj in state_list %}
            <li name="state" class="auto" title="{{state_obj.name}}"><a href="#{{state_obj.id}}" onclick=javascript:setlocation("{{state_obj.name}}")> {{ state_obj.name }}</a></li>
         {% endfor %}
    </ul>

私のJavaスクリプト関数

function setlocation(name){
    //alert(name);
    $('#id_autocomplete').val(name);
    document.getElementById('city_state').style.display="none"
}

そして私のテキストボックス

<input type="text" class="text2" name="location" id="id_autocomplete" placeholder="Enter Location" onfocus="show_div();" onkeyup="div_autocomplete()"/>

問題は、「空白」を含む状態がいくつかあり、それらのパラメーターを渡すと問題が発生することです。オブジェクトも同様に渡してみました

onclick=javascript:setlocation("{{state_obj}}")

しかし、これもうまくいきません。

4

1 に答える 1

4

HTML 属性値を引用符で囲む必要があります。

onclick="setlocation('{{state_obj.name}}')"

そうしないと、空白を含む値によって HTML が台無しになります。引用符を使用しない場合、次の空白までの文字のみが値の一部と見なされます。したがって、生成された HTML が

onclick=setlocation("foo bar")

次にonclick、値setlocation("fooとブール属性 を持つ属性があります（これはおそらく無効ですが、属性名にorbar")を含めることはできないと思います）。")

しかし実際には、インライン イベント ハンドラーを使用する代わりに、イベント デリゲーションまたはイベント ハンドラーをバインドする他の方法を使用できます。

于 2013-11-14T06:52:12.233 に答える