Question

这是我的代码我想从输入字段获取值，然后我希望它将它作为锚点附加到无序列表中作为锚标记基本上我创建一个列表或者你可以说navbar项链接我给输入“home “然后追加它然后输入”关于我们“并追加它。

 <!DOCTYPE>
  <html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
        <script>
          $(document).ready(function(){
               $("#btn2").click(function(){
               var v = $("#txt").val();
               $("ul").append("<li><a href='#'>",v,"</a></li>");

               });
          });
       </script>
     </head>
<body>
     <input id="txt" type="text">
     <ul>

     </ul>
     <button id="btn2">Append list items</button>

 </body>
</html>

Answer 1

你很亲密，看起来你需要用",v,"替换" + v + "

这是一个小提琴： https://jsfiddle.net/0ppc2mjs/

Answer 2

更改此行

$("ul").append("<li><a href='#'>",v,"</a></li>");

到这个

$("ul").append(`<li><a href='#'>${v}</a></li>`);

注意：我将双引号更改为反向标记以启用字符串插值。

Answer 3

你需要这个

$("ul").append("<li><a href='#'>"+ v + "</a></li>");

工作示例

＆＃13;

$(document).ready(function() {
  $("#btn2").click(function() {
    var v = $("#txt").val();
    $("ul").append("<li><a href='#'>"+ v + "</a></li>");
  });
});

＆＃13;

<!DOCTYPE>
<html>

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</head>

<body>
  <input id="txt" type="text">
  <ul>

  </ul>
  <button id="btn2">Append list items</button>

</body>

</html>

＆＃13;

从输入字段获取值并使用jQuery将其作为列表项附加

3 个答案: