在jquery追加语句中添加一个按钮变量

adding a button variable inside jquery append statement

本文关键字:一个 按钮 变量 追加 jquery 语句 添加      更新时间:2023-09-26

我正在尝试添加新的引导列表组项目,并在其中包含一个使用for循环的按钮。

testdiv.append("<a class='list-group-item list-group-item-action'> "
    + "<h6 class='list-group-item-heading'>" + value + "</h6>"
    + "<p class='list-group-item-text'>This requires approval</p>"
    + "<button onclick='approveReq("+ value +")' type='button' class='btn btn-primary'>Approve</button> </a>");

value是在for循环中创建的变量,因此每次它都会产生不同的结果。onclick='approveReq("+ value +")'应将此值作为approveReq(value)所要求的功能。

我不确定我是否解释得很好,有什么帮助吗?

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script 
    src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script>
    var testdiv = document.getElementById('abcd');
    $(document).ready(function(){
    var str = "";
       for(i=0;i<=10;i++){
        str+="<a class='list-group-item list-group-item-action'> "
        + "<h6 class='list-group-item-heading'>" + i + "</h6>"
        + "<p class='list-group-item-text'>This requires approval</p>"
        + "<button onclick='approveReq("+ i +")' type='button' class='btn btn-primary'>Approve</button> </a>";
      }
    $('#abcd').append(str);
    });
    </script>
    </head>
    <body>
    <div class="container" >
    <div class="list-group" id="abcd">
    </div>
    </div>
    </body>
    </html>

这是你想要的吗查看此代码