使用动态列表显示 getelementsbyclassname 值答案

【问题标题】：display getelementsbyclassname value with dynamic list使用动态列表显示 getelementsbyclassname 值
【发布时间】：2016-11-01 21:18:56
【问题描述】：

我是 jquery 的新手，所以我正在学习，我有一个具有唯一值的动态列表。我正在使用 getelementsbyclassname 在按钮单击时检索这些值。最初它只会显示第一个值无论我点击了哪个按钮都列出来，所以我添加了一个 for 循环，现在它一键显示所有值。我需要它在每次单击按钮时显示该行的值。

       <li>cats
        <param class="lke" value="152">
      <button class="btnSave">Save Click</button>

        </li> 
      <li>dogs 
        <param class="lke" value="151">
      <button class="btnSave">Save Click</button>

        </li>
       <li>Fish
        <param class="lke" value="150">
      <button class="btnSave">Save Click</button>

        </li>


   $(document).ready(function () {

    $(".btnSave").click(
        function () {
            popUp();
        }            
    );
});



var arr =document.getElementsByClassName('lke');

 function popUp(){

for(var i = 0;i < arr.length;i++){
    alert(arr[i].value);
}
}

【问题讨论】：

标签： javascript jquery for-loop getelementsbyclassname

【解决方案1】：

您可以执行以下操作。

// Bind to button click event
$('.btnSave').click(function(){
    // Alert the value attribute. This will always return for the first matching element
    alert($('.lke').attr('value'))
})

此处示例：https://jsfiddle.net/tk9kx8gz/

【讨论】：

嗨，马克，感谢您的回复，我需要显示当前值属性的函数，那么我如何让它显示下一个值，例如 151

【解决方案2】：

也许这个脚本可以帮助你

$('button.btnSave').click(function () {
  var param = $(this).prev();
  var value = $(param).attr('value');
  alert(value);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li>cats
        <param class="lke" value="152">
      <button class="btnSave">Save Click</button>

        </li> 
      <li>dogs 
        <param class="lke" value="151">
      <button class="btnSave">Save Click</button>

        </li>
       <li>Fish
        <param class="lke" value="150">
      <button class="btnSave">Save Click</button>

        </li>

【讨论】：