Question

如何将id值传递给函数？我正在做的是，当用户更改下拉列表时，它将获得下拉列表的值，并获得隐藏在foreach内部的输入值。

我从一边尝试过，要从下拉列表中更改值，但是如何在jquery中获取输入值？现在我得到了输入字段的最后一个值。

 $x=1;
 foreach ($duration as $row) {?>
  <input type="hidden" name="activeID" id="activeID<?php echo $x;?>" value="<?php echo $row->activity_name_id;?>">
 <select name="Duration<?php echo $x;?>"  class="form-control" id="Duration<?php echo $x;?>">
     <option selected disabled >Select year</option>    
     <option value="12m" <?php if($row->Duration  == '12m' ){ echo 'selected="selected"'; } ?>>1 Year</option>
     <option value="6m" <?php if($row->Duration  == '6m' ){ echo 'selected="selected"'; } ?>>6 months</option>
  </select>
<div id="results<?php echo $x;?>"></div>

    <?php $x++;}

jquery

$('[id^="Duration"]').change(function () {
  var a=$('input[id^="activeID"]').attr('id');// how to I display the input id here
  alert(a);
 var value = $('input[id^="activityID"]').val();// i tried this one as well
 alert(value);
 var end = this.value;
 alert(end);//getting drodpown id value
    });

Answer 1

我在您的代码中观察到的一件事：

$x=1;
 foreach ($duration as $row) {
  <input type="hidden" name="activeID" id="activeID<?php echo $x;?>" value="<?php echo $row->activity_name_id;?>">
 <select name="Duration<?php echo $x;?>"  class="form-control" id="Duration<?php echo $x;?>">
     <option selected disabled >Select year</option>    
     <option value="12m" <?php if($row->Duration  == '12m' ){ echo 'selected="selected"'; } ?>>1 Year</option>
     <option value="6m" <?php if($row->Duration  == '6m' ){ echo 'selected="selected"'; } ?>>6 months</option>
  </select>
<div id="results<?php echo $x;?>"></div>
    }

您根本没有在任何地方增加$x，因此每个隐藏的输入标记都在获取id = 'activeId1'

Answer 2

您可以将input和select放在div中。更改下拉列表后，获得input兄弟姐妹

<?php
$x=1;
foreach ($duration as $row) {
?>
  <div>
    //Your input and select here
  </div>
<?php   } ?>


<script>

$('[id^="Duration"]').change(function () {
   var input = $($(this).siblings("input")[0]); // get the input element
   var id = input.attr("id"); //id of the input
   var value = input.val(); //value of the input
   alert(value);
});
</script>

Answer 3

<?php

$x=1;
 foreach ($duration as $row) {
    ?>
  <input type="hidden" name="activeID" id="activeID<?php echo $x;?>" value="<?php echo $row->activity_name_id;?>">
 <select name="Duration<?php echo $x;?>"  class="form-control DurationClass" id="Duration<?php echo $x;?>">
     <option selected disabled >Select year</option>    
     <option value="12m" <?php if($row->Duration  == '12m' ){ echo 'selected="selected"'; } ?>>1 Year</option>
     <option value="6m" <?php if($row->Duration  == '6m' ){ echo 'selected="selected"'; } ?>>6 months</option>
  </select>
<div id="results<?php echo $x;?>"></div>
<?php   } ?>


<script>

$('.DurationClass').change(function () {
   var a=$('input[id^="activeID"]').attr('id'); 
   var selectID=$(this).attr('id'); 
  //alert(a);
 var value = $(this).val(); //  in loop every dropdown select current option value return
 alert(value);

    });
</script>

Answer 4

您可以在代码的HTML部分中使用onchange事件

$x=1;
 foreach ($duration as $row) {?>
  <input type="hidden" class="activeID" name="activeID" id="activeID<?php echo $x;?>" value="<?php echo $row->activity_name_id;?>">
 <select name="Duration<?php echo $x;?>" onchange="myfunction();" class="form-control" id="Duration<?php echo $x;?>">
     <option selected disabled >Select year</option>    
     <option value="12m" <?php if($row->Duration  == '12m' ){ echo 'selected="selected"'; } ?>>1 Year</option>
     <option value="6m" <?php if($row->Duration  == '6m' ){ echo 'selected="selected"'; } ?>>6 months</option>
  </select>
<div id="results<?php echo $x;?>"></div>

    <?php $x++;}

这是功能

function myfunction () {
  alert($(this).parent()); //what are you getting
  alert($(this).parent().find(".activeID").value()); //what are you getting?
  alert("Id of the select box is "+ this.id);
  alert("Value of the select box is "+this.value );
    };

Answer 5

$(".select").change(function(){
  alert("Id of the select box is "+ this.id);
  alert("Value of the select box is "+this.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="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>

<div class="container">
  <h2>Form control: select</h2>
  <p>The form below contains two dropdown menus (select lists):</p>
  <form>
    <div class="form-group">
      <label for="sel1">Select list (select one):</label>
      <select class="form-control select" id="Sell">
        <option>1</option>
        <option>2</option>
        <option>3</option>
        <option>4</option>
      </select>
      <label for="sel1-item">Select list sell item (select one):</label>
      <select class="form-control select" id="Sell-item">
        <option>car</option>
        <option>bike</option>
        <option>cycle</option>
        <option>auto</option>
      </select>
    </div>
  </form>
</div>

</body>
</html>

如何将id值传递给函数？

5 个答案: