使用输入类名称引用的javascript从输入字段中检索值不正确 [英] Inaccurate retrieval of values from an input fields using javascript referenced by inputs class names

问题描述

我创建了一个由ID填充的输入字段，稍后将使用它们通过javascript在我的数据库中进行查询.使用foreach循环，使用各自的ID正确填充字段.使用javascript，我希望能够访问此id，但是，使用基于其类名的onclick函数，第一和第二输入字段的值是唯一返回正确id值的字段，其余输入字段值是从ID值为2的第二个输入字段中获取的，而不是返回正确的ID值.这有什么问题?如何从此输入字段检索正确的id值?非常感谢.这是我的代码

I have created an input fields populated by ids that I will use later to make a query in my database via javascript. Using foreach loop, the fields were populated correctly by their respective ids. Using javascript I want to be able to access this ids, however, using the onclick function that is based on their class name, the values for the first and second input fields are the only fields that returns the correct id value and the rest input field values were taken from the second input field having the id value of 2 instead of returning the right id value. What is the wrong with this? How could I retrieve right id values from this input fields? Thanks a lot. Here is my code

查看:

<?php

     foreach($data_currencies as $row){

    ?>
     <div class="row-fluid">

            <div class="span2"><input type='checkbox' class="currency_check_box" id='chk' name='currency_id[]'  value="<?php echo $row->id; ?>" /></div>
            <div class="span4" style="text-color:black;"><?php  echo anchor("currencies/edit_currency/$row->id/$tennant_id",$row->pretty_name);?></div>
            <div class="span4" style="text-color:black;"><?php  echo $row->currency_code;?></div>
            <div class="btn-group span1" id="condition" data-toggle="buttons-radio" >
            <?php if($row->status==1) { ?>
            <input type="text" value="<?php echo $row->id; ?>" class="btn active first" id="enable"/>
            <input type="text" value="<?php echo $row->id; ?>" class="btn passive" id="disable"/>
            <?php }
             else{ ?>
            <input type="text" value="<?php echo $row->id; ?>" class="btn off" id="enable"/>
            <input type="text" value="<?php echo $row->id; ?>" class="btn active on" id="disable"/>
            <?php } ?>
            </div>
     </div>
    </address>
    <address>
     <?php
     }
     ?>

JavaScript

Javascript

<script type="text/javascript">


$(".first").click(function(){
   alert($(".first").val());
});

$(".passive ").click(function(){
   alert($(".passive").val());
});

$(".off").click(function(){
   alert($(".off").val());
});

$(".on ").click(function(){
   alert($(".on").val());
});

</script>

输出:

点击ID值为1的输入字段

Clicking the input field with id value 1

点击ID值为2的输入字段

Clicking the input field with id value 2

单击其余输入字段将得到相同的输出

Clicking the remaining input fields gives the same outputs

推荐答案

问题是您需要在js中使用 this 关键字.否则，您将只获得该类的第一次出现的元素.同时考虑到所有输入字段都有'btn'类，为什么不将js更改为

The problem is that you need to use the this keyword in your js. Otherwise you will just be getting the element with the first occurence of that class. Also considering all of your input fields have the 'btn' class why don't you change your js to

$(".btn").click(function(){
   //Use 'this' to get the value of the element you clicked on
   alert($(this).val());
});

注意:您正在遍历PHP代码中的行，但是每次都给元素相同的ID(id ="enable"和id ="disabled").这将导致多个元素具有相同的ID，这将使您的HTML无效，并可能在以后导致您遇到问题.

Note You are looping through your rows in your PHP code but each time giving the elements the same id (id="enable" and id="disabled"). This will cause multiple elements to have the same id, which will invalidate your HTML and could cause you problems later on.

这篇关于使用输入类名称引用的javascript从输入字段中检索值不正确的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！