Javascript 在“把手”中选择“选择”选项时自动填充其他字段

Javascript 在“把手”中选择“选择”选项时自动填充其他字段,javascript,handlebars.js,Javascript,Handlebars.js,我有一个模式,看起来像这样,我想自动填充价格输入值,每当我从文章列表中选择一个产品。我该如何实现这一目标?多谢各位 <div class="modal-body"> <div> <label for="type">article</label> <select id="article" name="article" class="form-control

我有一个模式,看起来像这样,我想自动填充价格输入值,每当我从文章列表中选择一个产品。我该如何实现这一目标?多谢各位

<div class="modal-body">

            <div>
                <label for="type">article</label>
                <select id="article" name="article" class="form-control">
                    {{#each articles}}
                    <option>{{name}}</option>
                    {{/each}}
                </select>

            </div>
            <input type="text" class="form-control" name="desc" id="desc" placeholder="Description" value="{{desc}}">
            <input type="text" class="form-control" name="quantity" id="quantity" placeholder="Qté commandée" value="{{quantity}}">
            <input type="text" class="form-control" name="price" id="price" placeholder="Prix Unitaire" value="{{price}}">
            <input type="text" class="form-control" name="tax" id="tax" placeholder="Taxes" value="{{tax}}">
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Quité</button>
            <button type="button" name="add" id="add" onclick="isValid()" class="btn btn-primary" data-dismiss="modal">Ajouter</button>
        </div>

有什么帮助吗???

我没有测试它,但是像这样的东西

<div class="modal-body">
    <div>
        <label for="type">article</label>
        <select id="article" name="article" class="form-control">
            {{#each articles}}
                <option data-price="{{price}}">{{name}}</option>
            {{/each}}
        </select>
    </div>
    <input type="text" class="form-control" name="desc" id="desc" placeholder="Description" value="{{desc}}">
    <input type="text" class="form-control" name="quantity" id="quantity" placeholder="Qté commandée" value="{{quantity}}">
    <input type="text" class="form-control" name="price" id="price" placeholder="Prix Unitaire" value="{{price}}">
    <input type="text" class="form-control" name="tax" id="tax" placeholder="Taxes" value="{{tax}}">
</div>

<div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Quité</button>
    <button type="button" name="add" id="add" onclick="isValid()" class="btn btn-primary" data-dismiss="modal">Ajouter</button>
</div>

<script>
    $(document).ready(function () {
        $('#article').change(function () {
            var price = $(this).find(':selected').attr('data-price');
            $('#price').attr('value', price);
        });
    });
</script>