如果 select 更改，则设置输入字段

Question

我有以下示例数据：

books = [
 {
  id: 1,
  name: Harry Potter,
  description: test1
 },
 {
  id: 2,
  name: Forest Gump,
  description: test2
 }
]

JSP

<select onchange="bookLib.changeBook()">
  <c:forEach var="book" items="${books }">
      <option value="${book.id}">
          <c:out value="${book.name}"/>
      </option>
  </c:forEach>
</select>

<input type="TEXT" id="descr" readonly/>

当"select"改变时，我需要在id为"descr"的文本输入中设置${book.description}。

我需要在函数 bookLib.changeBook().js 中用 jQuery 实现它。

Answer 1

<select onchange="bookLib.changeBook(this);">
  <c:forEach var="book" items="${books }">
      <option value="${book.id}" data-description="${book.descripton}">
          <c:out value="${book.name}"/>
      </option>
  </c:forEach>
</select>

<input type="TEXT" id="descr" readonly/>

function changeBook(select) {
    $("#descr").val($(select).find("option:selected").attr("data-description"));
}

或者，如果您无法控制 changeBook 的签名：

<select id="books" onchange="bookLib.changeBook()">
  <c:forEach var="book" items="${books }">
      <option value="${book.id}" data-description="${book.descripton}">
          <c:out value="${book.name}"/>
      </option>
  </c:forEach>
</select>

<input type="TEXT" id="descr" readonly/>

function changeBook() {
    $("#descr").val($("#books option:selected").attr("data-description"));
}

如果 select 更改，则设置输入字段

set input fields if select change

jquery

jsp

jstl