-1

テキスト入力値に基づいて選択オプションを変更したいのですが。

たとえば、mydomain.comと入力すると、次のようになります。

  • 「mydomain」と入力します
  • 私はタイプする "。" (ドット)
  • テキスト入力への値の追加を停止します
  • 「.com」で選択オプションを検索して選択します

私はそれをより明確にするために私のこの古い質問を編集しました。これは私がその時に持っていたスクリーンショットです、それは問題を説明するのを助けるかもしれません:

バグx作業バージョン

コード例:

<input type="text" autocomplete="off" id="domain" name="domain">

<select id="extension" name="extension">
    <option value=".com">.com</option>
    <option value=".com.br">.com.br</option>
    <option value=".net">.net</option>
    <option value=".org">.org</option>
    <option value=".info">.info</option>
    <option value=".biz">.biz</option>
    <option value=".tv">.tv</option>
    <option value=".name">.name</option>
    <option value=".ws">.ws</option>
    <option value=".cc">.cc</option>
    <option value=".blog.br">.blog.br</option>
    <option value=".flog.br">.flog.br</option>
    <option value=".vlog.br">.vlog.br</option>
    <option value=".wiki.br">.wiki.br</option>
    <option value=".adm.br">.adm.br</option>
    <option value=".adv.br">.adv.br</option>
    <option value=".agr.br">.agr.br</option>
    <option value=".am.br">.am.br</option>
    <option value=".arq.br">.arq.br</option>
    <option value=".art.br">.art.br</option>
    <option value=".ato.br">.ato.br</option>
    <option value=".bio.br">.bio.br</option>
    <option value=".bmd.br">.bmd.br</option>
    <option value=".cim.br">.cim.br</option>
    <option value=".cng.br">.cng.br</option>
    <option value=".cnt.br">.cnt.br</option>
    <option value=".coop.br">.coop.br</option>
    <option value=".ecn.br">.ecn.br</option>
    <option value=".edu.br">.edu.br</option>
    <option value=".eng.br">.eng.br</option>
    <option value=".esp.br">.esp.br</option>
    <option value=".etc.br">.etc.br</option>
    <option value=".eti.br">.eti.br</option>
    <option value=".far.br">.far.br</option>
    <option value=".fm.br">.fm.br</option>
    <option value=".fnd.br">.fnd.br</option>
    <option value=".fot.br">.fot.br</option>
    <option value=".fst.br">.fst.br</option>
    <option value=".g12.br">.g12.br</option>
    <option value=".ggf.br">.ggf.br</option>
    <option value=".gov.br">.gov.br</option>
    <option value=".imb.br">.imb.br</option>
    <option value=".ind.br">.ind.br</option>
    <option value=".inf.br">.inf.br</option>
    <option value=".jor.br">.jor.br</option>
    <option value=".lel.br">.lel.br</option>
    <option value=".mat.br">.mat.br</option>
    <option value=".med.br">.med.br</option>
    <option value=".mil.br">.mil.br</option>
    <option value=".mus.br">.mus.br</option>
    <option value=".net.br">.net.br</option>
    <option value=".nom.br">.nom.br</option>
    <option value=".not.br">.not.br</option>
    <option value=".ntr.br">.ntr.br</option>
    <option value=".odo.br">.odo.br</option>
    <option value=".org.br">.org.br</option>
    <option value=".ppg.br">.ppg.br</option>
    <option value=".pro.br">.pro.br</option>
    <option value=".psc.br">.psc.br</option>
    <option value=".psi.br">.psi.br</option>
    <option value=".qsl.br">.qsl.br</option>
    <option value=".rec.br">.rec.br</option>
    <option value=".slg.br">.slg.br</option>
    <option value=".srv.br">.srv.br</option>
    <option value=".tmp.br">.tmp.br</option>
    <option value=".trd.br">.trd.br</option>
    <option value=".tur.br">.tur.br</option>
    <option value=".tv.br">.tv.br</option>
    <option value=".vet.br">.vet.br</option>
    <option value=".zlg.br">.zlg.br</option>
</select>
4

2 に答える 2

1

ユーザーが入力するときにjQueryを使用してこれを行うことができます...

$(document).ready(function() {
    $('#search').keyup(function() {
        //The user has typed something. See what they typed and split it.
        var value = $(this).val();
        var components = value.split(".");
        if(components.length == 2) {
            //They have typed a TLD like .com
            if($("#extensao option[value='."+ components[1] + "']").length > 0) {
                //They have typed an available TLD. Select the dropdown and update the box.
                $("#search").val(components[0]);
                $("#extensao").val("." + components[1]);
            }
        } else if (components.length > 2) {
            //They have typed a Second level domain like .blog.br
            if($("#extensao option[value='."+ components[components.length - 2] + "." + components[components.length - 1] + "']").length > 0) {
                //They have typed an available second level domain.
                $("#search").val(components[0]);
                $("#extensao").val("." + components[components.length - 2] + "." + components[components.length - 1]);
            }
        }
    });
});

これがあなたが探していた種類のソリューション(またはサーバー側の何か)であったかどうかはわかりません。いずれにせよ、追加のサーバー側の検証が必要になります。

于 2013-02-24T15:53:08.010 に答える
0

私には2つのアイデアがあります

  • 文字列を解析して、末尾の「.tld」を切り取ります。
  • 入力フィールドで「 」を禁止します。「検索」ボタンを押すと、許可されていない文字を検出する機能がトリガーされます。見つかった場合はエラーになります。すべてがうまくいけば、2番目の画像の結果が表示されます。この問題の詳細http://www.regular-expressions.info/、または同様のスタックの質問php文字列内の無効な文字を確認してください
于 2013-02-24T15:24:08.797 に答える