如何在jquery中获取两个动态文本框值答案

【问题标题】：how to get two dynamic textbox value in jquery如何在jquery中获取两个动态文本框值
【发布时间】：2016-12-12 20:22:02
【问题描述】：

在此先感谢，实际上我有一个带有两个隐藏文本框字段的表单，一个是<input type="hidden" name="item_name" class="course_name" value="<?php echo $cartData['exam'];?>">，另一个是<input type="hidden" name="amount" class="amount" value="<?php echo $priceTotal;?>">，该值是通过循环从 PHP 代码动态获取到隐藏字段内的。那么，当单击 id="placeOrder" 的图像按钮时，如何使用 Jquery 获取逗号分隔的“item_name”文本框字段和“amount”文本框字段的动态值。例如像这样：金额-->200,300 和课程名称-->PMP,CAPM。我已经编写了一些代码，它将在每个循环中获取 jquery 中的值，但我必须通过 ajax 作为 json 格式，例如 data : {cname:course_name,priceBox:textboxVal} 所以逗号分隔值的值应该通过 course_name 和 textboxVal。

我的页面是

<html>
 <head>
  <title></title>
  <script>
    $(document).ready(function(){
      var myArray = [];
      $('.amount').each(function(){        

         var textboxVal = $(this).val(); 
         //alert(textboxVal);          

        });

       var myCourse = [];
         //dynamic course name
         $('.course_name').each(function(){

            var course_name = $(this).val();  
            //alert(course_name); 

           });

           if(textboxVal!="")
          {

                $.ajax({ 

                   type : "POST",     
                   url : "/invl_exams/cart",                  
                   cache : "false",
                   data :      {cname:course_name,priceBox:textboxVal},           
                   success : function(result){       

                     console.log(result);                                    

                   } 


              }); 


          }   


    });
  </script>
 </head>
</html>
<form action="https://www.sandbox.paypal.com/cgi-bin/webscr" method="post">

         <td>            
            <input type="hidden" name="cmd" value="_xclick">
            <input type="hidden" name="business" value="shopbusiness@myshop.com">      
            <input type="hidden" name="upload" value="1">   
            <?php             

               if(isset($cartDatas)) 
                 { 
                   $itm_no = 1;
                   $amt = 0;                              
                   foreach($cartDatas as $key=> $cartData)  
                   {

                     $prices = $cartData['price'];     
                     $prd_price = ltrim($prices,'$');
                     $priceTotal = number_format((float)$prd_price, 2, '.', '');   


            ?>

              <input type="hidden" name="item_number" value="<?php echo $itm_no++;?>">        
              <input type="hidden" name="item_name" class="course_name" value="<?php echo $cartData['exam'];?>">     
              <input type="hidden" name="amount" class="amount" value="<?php echo $priceTotal;?>"> 
              <input type="hidden" name="shipping" value="shipping Address">  
              <input type="hidden" name="quantity" value="<?php echo $cartData['orders'];?>">      

            <?php                 

                  $price = ltrim($prices,'$');  
                  $orders = $cartData['orders'];              
                  $amt_Total = $price * $orders;
                  $amt += $amt_Total;
                  $amt_Total = number_format((float)$amt, 2, '.', ''); 

                  ///$amt_Total = round($price * floatval( $orders ),2); 


                }               

            ?>

              <input type="hidden" name="currency_code" value="USD">              
              <input type="hidden" name="amount" value="<?php echo $amt_Total;?>">                    
            <?php

              }

            ?>
            <input type="image" src="http://www.paypal.com/en_US/i/btn/x-click-but03.gif" name="submit" id="placeOrder">              
      </td>
      </form>

【问题讨论】：

遍历 -- stackoverflow.com/questions/34366218/how-to-get-value-from-dynamic-created-hidden-field-in-jquery

标签： javascript php jquery html

【解决方案1】：

您可以执行以下操作：

$(function(){
    var amount = [];
  var course = [];
    $('.amount').each(function(){ 
    amount.push($(this).val());
  });
  $('.course_name').each(function(){
    course.push($(this).val());
  });
  console.log(amount.join(',')); //comma seperated value
  console.log(course.join(',')) //comma seperated value
});

DEMO

【讨论】：

【解决方案2】：

你可以使用jQuery和属性选择器来获取值：

var item_name = $('input[name=\'item_name\']').val();
var amount = $('input[name=\'amount\']').val();

var result = item_name + ',' + amount;

现在您可以将其放入您的点击处理程序中。

【讨论】：

【解决方案3】：

如果您的输入包含在表单元素中，您可以使用此方法将表单输入值序列化为 json 对象，然后将其传递给 ajax 调用。

var postData = $("#enclosing_form_elm").serializeObject();

并在您的脚本中添加对 jquery 之后的序列化对象函数的引用

$.fn.serializeObject = function()
{
var o = {};
var a = this.serializeArray();
$.each(a, function() {
    if (o[this.name] !== undefined) {
        if (!o[this.name].push) {
            o[this.name] = [o[this.name]];
        }
        o[this.name].push(this.value || '');
    } else {
        o[this.name] = this.value || '';
    }
});
return o;

};

只是一个演示https://plnkr.co/edit/7maJAUSdakDuvVqXhnzi?p=preview

感谢Convert form data to JavaScript object with jQuery

【讨论】：