0

私はこことGoogleで可能な答えを探すことに本当に力を入れてきました. 私はいくつかの答えを見つけましたが、それらを自分のコードと状況に適用すると、うまくいきません。

私は試した：

$("select#city option['City, ST']").attr('selected', 'selected');

私も試しました：

$("select#city").val('City, ST');

どこかで示唆されたように。

このコードを document.ready 関数に入れてみましたが、役に立ちませんでした。次に、document.ready を使用せずに (head セクションではなく) 一番上に配置しようとしましたが、それでも同じです。

この関数が失敗する理由は何ですか? それが呼び出された瞬間が重要です (つまり、値を持つ選択ボックスが最初にレンダリングされてから関数が呼び出されるかどうかは重要ですか? それとも、他の何かでしょうか?

HTML コード:

<div class="ui-widget">
            <h3>Location</h3>
            <form id="chooseCity" class="" action="" method="post">
                <select id="city" name="city">

                    <option value="Select Town">Select Town</option>
                    <option value='Acworth, NH'>Acworth, NH</option>
                    <option value='Alstead, NH'>Alstead, NH</option>
                    <option value='Alton, NH'>Alton, NH</option>
                    <option value='Alton Bay, NH'>Alton Bay, NH</option>
                    <option value='Amherst, NH'>Amherst, NH</option>
                    <option value='Andover, NH'>Andover, NH</option>
                    <option value='Antrim, NH'>Antrim, NH</option>
                    <option value='Concord, NH'>Concord, NH</option>
                </select>
            </form>
        </div>

このループが原因でしょうか? 多分それはどういうわけか干渉しています：

                <option value="Select Town">Select Town</option>
                    <?php foreach($arr as $city):
                        echo "<option value='{$city}'";
                        echo ($_POST['city-hp'] == $city) ? 'selected' : '';
                        echo ">".$city."</option>".PHP_EOL;
                    endforeach; ?>

重要な編集:

このコードの一部を発見しました：

$(function() {
    $( "#city" ).combobox();
    $( "#toggle" ).click(function() {
        $( "#city" ).toggle();
    });
});

コンボボックスがプログラムで目的の値を選択するのを妨げています。ただし、このコードは、選択ボックスのスタイルを設定するために重要です。jQuery UI Web サイトからサンプルをダウンロードし、自分の Web サイトに統合しました。

上記のコードを変更して、目的の機能を実現しながら外観を維持するにはどうすればよいでしょうか?

4

5 に答える 5

2

これを試して、プログラムでオプションを選択することができます

HTML

<select id="city">
    <option value=1>CityOne</option>
    <option value=2>CityTwo</option>
</select>

JS

$('#city').val(2); // will select the item which has value=2

また

$('#city').prop("selectedIndex",1); // will select second item/index, first is 0

デモ。

于 2012-10-04T22:21:53.610 に答える
1

これを試して

  $('select#city').find('option[value*="City"][value*="ST"]').attr('selected', 'selected');

また

$("select#city option[value='City, ST']").attr('selected', 'selected');

デモをチェック

于 2012-10-04T22:19:58.597 に答える
1

あなたのjQueryは動作します- 何か他のものが干渉しています.

インストールした可能性のある他のプラグインを突っ込んで、選択したインデックスをオーバーライドしているかどうかを確認することをお勧めします。おそらく<option>選択の最初のものだけです。
または、使用しているテクノロジーについて詳しく知りたい場合は、誰かがさらに助けてくれるかもしれません。

編集：

この関連する質問の回答を参照してください 。プラグインのソースを編集する必要があるようです。

コンボボックス プラグインで次の行を見つけます。

.addClass("ui-widget ui-widget-content ui-corner-left");

その直後に次の行を追加します。

input.val( $(select).find("option:selected").text());

ソース

于 2012-10-04T23:13:36.167 に答える
0

私はこのエラーを困惑させ、コーディングしたものに関係なく OnLoad イベントを修正できません (おそらく 3 時間後)。最後に幸運なことに、私はhttp://www.onemoretake.com/2011/04/17/a-better-jquery-ui-combo-box/ Webページ（私の頭痛を解決してくれた@DanのThx）に出くわし、実際の欠落を見ました一部は「OnLoad」ではなく、UI定義関数自体にあります。公式の Jquery Ui Web ページの標準定義関数には、プログラムによる選択オプションが含まれていません。

定義関数に追加する必要がある関数は次のとおりです。

//allows programmatic selection of combo using the option value
        setValue: function (value) {
            var $input = this.input;
            $("option", this.element).each(function () {
                if ($(this).val() == value) {
                    this.selected = true;
                    $input.val(this.text);
                    return false;
                }
            });
        }

また、オプション値ではなくオプションテキストを介して選択を変更する別の関数を作成しました

//allows programmatic selection of combo using the option text
            setValueText: function (valueText) {
                var $input = this.input;
                var selectedText;                   
                $("option", this.element).each(function () {
                    if ($(this).text() == valueText) {
                        this.selected = true;
                        $input.val(this.text);                                                    
                        return false;
                    }
                });                        
            }

これらの関数を OnLoad または別の関数で次のように使用できます。

$("#yourComboBoxID").combobox("setValue", "Your Option Value");

また

$("#yourComboBoxID").combobox("setValueText", "Your Option Text");
于 2015-04-04T12:47:20.563 に答える
-2

test は JavaScript オブジェクトです。

test.controlid は、ウィジェット インスタンスの ID です。

test.value は、選択する文字列です。

テスト オブジェクトは必要ありません。ID と値を直接使用できます。

$("#" + test.controlid).parent().find("span").children("input").val(test.value);

var newObject = new Object();

newObject.item = new Object();

newObject.item.option = $('#' + test.controlid +' > option[value="' + test.value + '"]')[0];

$("#" + test.controlid).parent().find("span").children("input").trigger("autocompleteselect", newObject);
于 2015-02-10T15:51:32.310 に答える