Question

我无法在spring boot模板中获取元素的值，我的模板：

$("#article-list .list-item").click(function() {
  console.log($("#test").val());
});
$(document).ready(function() {
  $("#article-list").css("background-color", "red");
});

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
  <body>
    <ul id="article-list">
      <h1 id="test">this is the test content</h1>
      <li class="list-item">
        <h2 class="article-title">title</h2>
        <p class="article-excerpt">content</p>
        <span class="article-time">2017-12-22</span>
      </li>
      <li class="list-item">
        <h2 class="article-title">title</h2>
        <p class="article-excerpt">content</p>
        <span class="article-time">2017-12-22</span>
      </li>
    </ul>
    <script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
  </body>
</html>

h1的值总是为空，我无法得到它。而且，我测试了jQuery，它有效。使用jQuery更改ul元素背景颜色，没关系。像这样：

但我无法获得h1

的价值

Answer 1

您无法使用.val()获取输入和选择元素的h1内容。使用.text()或.html()

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title></title>
</head>
<body>
<ul id="article-list">
    <h1 id="test">this is the test content</h1>
    <li class="list-item">
        <h2 class="article-title">title</h2>
        <p class="article-excerpt">content</p>
        <span class="article-time">2017-12-22</span>
    </li>
    <li class="list-item">
        <h2 class="article-title">title</h2>
        <p class="article-excerpt">content</p>
        <span class="article-time">2017-12-22</span>
    </li>
</ul>
<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
<script type="text/javascript">
    $("#article-list .list-item").click(function() {
        console.log($("#test").text());
    });
</script>
</body>
</html>

jQuery：无法获取元素的值

1 个答案: