Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/388.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 更改html输入字段中的占位符属性_Javascript_Jquery_Html_Html Datalist - Fatal编程技术网

Javascript 更改html输入字段中的占位符属性

Javascript 更改html输入字段中的占位符属性,javascript,jquery,html,html-datalist,Javascript,Jquery,Html,Html Datalist,我有一个表单,它有一个使用数据列表的输入字段,我想做的是当从该字段中选择某个内容时,用所选内容更新另一个输入字段,这是我到目前为止所做的 <div class='form-row'> <div class='col-xs-12 form-group required'> <h2><label class='control-label'&

我有一个表单,它有一个使用数据列表的输入字段,我想做的是当从该字段中选择某个内容时,用所选内容更新另一个输入字段,这是我到目前为止所做的

                <div class='form-row'>
                    <div class='col-xs-12 form-group required'>
                        <h2><label class='control-label'>Product code</label></h2>
                        <input id="ItemSelect" type=text list=jobs style='font-size:21px;height: 40px;'
                               class='form-control'
                               name="Code">
                        <datalist id=jobs>
                            <?php
                            foreach ($this->Products as $a) {
                                echo '<option value=' . $a["Code"] . '>' . $a["Code"] . " - " . $a["Name"] . ' </option>';
                            }
                            ?>
                        </datalist>
                    </div>

                    <div class='col-xs-12 form-group required'>
                        <input id="Placeholder" readonly class='form-control'
                               placeholder="Prodcut Descirption">
                    </div>

                    <script>
                        $("#ItemSelect")
                            .change(function () {
                                var str = "";
                                $("datalist option:selected").each(function () {
                                    str += $(this).text() + " ";
                                });
                                $("#Placeholder").attr("placeholder", str).val("").focus().blur();
                            })
                            .change();

                    </script>

它确实会将所有其他选择字段的值放在其中。有什么想法吗?

在数据列表中没有选项:selected

<datalist id=jobs>

should change datalist tag to select tag

<select id=jobs>

once you change that the below statement will work

$("select option:selected") 
您可以通过查看输入中的当前内容来获取所选值:

如果您只想在数据列表中实际存在输入值时执行此操作:

$("#ItemSelect").change(function() {
    var str = $(this).val() + " ";.

    $('datalist option').each(function() {
        if($(this).text() === str) {
            $("#Placeholder").attr("placeholder", str).val("").focus().blur();
        }
    }); 
});

我还有其他选择,所以如果我这样做,我从他们所有人那里得到数据,我怎么能避免呢?那么你需要使用ID单独定位他们,而不是标记。我尝试过,它似乎不起作用。请你提供一个示例,而不是$select选项:selected使用$jobs选项:selected以目标
<datalist id=jobs>

should change datalist tag to select tag

<select id=jobs>

once you change that the below statement will work

$("select option:selected") 
$("#ItemSelect").change(function() {
    var str = $(this).val() + " ";
    $("#Placeholder").attr("placeholder", str).val("").focus().blur();
});
$("#ItemSelect").change(function() {
    var str = $(this).val() + " ";.

    $('datalist option').each(function() {
        if($(this).text() === str) {
            $("#Placeholder").attr("placeholder", str).val("").focus().blur();
        }
    }); 
});