12

非常にシンプルで簡単です。値を選択してSQLiteデータベースに挿入したいときに、HTMLデータリストに値を事前に入力しました。これは動作していない私のコード例です。助けてください。HTML5 データリスト フォームの作成:

<input  name="TypeList" list="TypeList" placeholder="Select Type"/>
<datalist id="TypeList">
    <option value="State">
    <option value="Area">
    <option value="Town">
    <option value="Street">
    <option value="Number">
    <option value="Local Government">
    <option value="Ward">
    <option value="Country">
</datalist>

これは、機能しなかったサンプル jquery コードです。

var relationshipTemp = $('#TypeList option:selected').text();
4

11 に答える 11

20

入力要素を選択するセレクターを用意します。値を移動したいイベントを指定します。.val() を使用して値を取得します。

例:

$("input[name=TypeList]").focusout(function(){
    alert($(this).val());
});

これがあなたが探しているものであることを願っています

于 2014-04-03T17:28:53.373 に答える
11

:selecteddatalist1 つのデータリストが複数の入力に対して提案を提供できるため、オプションでは機能しません。2 つの異なる入力にリストからの 2 つの異なる提案が含まれている場合、どちらが選択されますか?

他のコメントで述べたように、次のように変更時に入力の値を確認できます。

$("input[name='Typelist']").on('input', function(e){
    var selected = $(this).val();
});

ただし、値が実際にデータリストのオプションの 1 つであることを確認したい場合は、追加のチェックを行う必要があります。データリストの場合、訪問者は入力に異なる値を入力できるからです。Datalist は提案を提供するだけです。

値がデータリストにあるかどうかを確認するソリューション:

$("input[name='Typelist']").on('input', function(e){
   var $input = $(this),
       val = $input.val();
       list = $input.attr('list'),
       match = $('#'+list + ' option').filter(function() {
           return ($(this).val() === val);
       });

    if(match.length > 0) {
        // value is in list
    } else {
        // value is not in list
    }
});
于 2015-04-23T08:57:56.583 に答える
3

これを試して。

$('#id_relative option[datalisted=datalisted]').val()
于 2016-11-21T19:07:54.010 に答える
2

「.on()」を使用します。

HTML

<input type="text" name="display" id="display" value="" list="list-display" />
<datalist id="list-display">
 <option>Name</option>
 <option>Id</option>
</datalist>

Javascript

$("#display").on('input',function(e){
 alert($(this).val());
});
于 2014-12-19T00:51:45.917 に答える