jsp:name属性和下拉框的option的值关联在一起

表单:

</div>
<form class="form-inline" action="/user/getBookByExample" method="get">
    <div class="pform-group mb-2">
        <input tye="text" readonly class="form-control-plaintext" id="staticEmail2" value="请输入要查询的书籍:">
    </div>
    <div class="form-group mx-sm-3 mb-2">
        <input id="my-input" type="text" class="form-control" name="bookName"  placeholder="霸道总裁">
    </div>
    <button type="submit" class="btn btn-primary mb-2">搜索图书</button>
</form>

下拉框

<div class="form-inline">
    <select id="my-select" class="form-control">
        <option  value="bookName">根据书名搜索</option>
        <option  value ="bookPrice">根据价格搜索</option>
        <option  value ="bookWriter">根据作者搜索</option>
        <option  value="bookId">根据书本id搜索</option>
    </select>
</div>

js实现绑定

<script type="text/javascript">
    let mySelect = document.querySelector("#my-select")
    let myInput = document.querySelector("#my-input")
    mySelect.addEventListener("change",(e) => {
        myInput.name = e.target.value
    })
</script>

版权声明:本文为weixin_44357646原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。