jQuery-如何从同一类中隐藏的输入id中获取不同的值

jQuery - how to get different value from hidden input id inside same class?

本文关键字：隐藏 输入 id 获取 jQuery- 一类      更新时间：2024-05-30

我想从同一类中的隐藏输入id中获得不同的值。下面是我试图创建的html和jQuery的一些示例代码。

 <li>
   <div class="test"><img src="course.png"/><p class="text">Computer</p>
    <span class="list">
      <p>Course 1 <input type="hidden" id="id1" value="1"></p>
      <p>Course 2 <input type="hidden" id="id2" value="2"></p>
      <p>Course 3 <input type="hidden" id="id3" value="3"></p>
    </span> 
   </div>
  </li>

我试图创建的代码

$(".test p").click(function(){
    var id= $(this).find('#id1').val(); 
    var id= $(this).find('#id2').val();
    var id= $(this).find('#id3').val();
    alert(id);    // will return value 1 or 2 or 3 if click on any course
});

不要将"id"用作var名称。

这应该有效：

$(".test p").click(function(){
    var myID = $(this).find('input').val(); 
    alert(myID);    // will return value 1 or 2 or 3 if click on any course
});

jsFiddle演示

最好为p和输入标签设置class，而不是id，使用

 <li>
   <div class="test"><img src="course.png"/><p class="text">Computer</p>
    <span class="list">
      <p class="myCourse">Course 1 <input type="hidden" class="myCourseVal" value="1"></p>
      <p class="myCourse">Course 2 <input type="hidden" class="myCourseVal" value="2"></p>
      <p class="myCourse">Course 3 <input type="hidden" class="myCourseVal" value="3"></p>
    </span> 
   </div>
  </li>
$(".test .myCourse").click(function(){
    var myValue = $(this).find('.myCourseVal').val()); 
    alert(myValue);
});

最好使用class而不是input tag，这样，如果将来添加其他输入，就可以根据需要正确地获得值。

如果你不使用类来满足你想要的p，那么如果你点击Computer，你的代码就会开始运行。

如果你想拥有你的课程价值观，你的课程名称：

$(".test .text").click(function(){
   var x = [];
   foreach('.myCourse',function(){
       x.push($(this).find('.myCourseVal').val(); 
   })
   alert(x);
});
相关文章：