Question

要回显已选中复选框的值，我正在使用此Ajax代码：

HTML：

 <input type="checkbox" class="cb" value="PHP" /> PHP <br />  
 <input type="checkbox" class="cb" value="ASP" /> ASP <br />  
 <input type="checkbox" class="cb" value="JSP" /> JSP <br /> 

 <button type="button" class="values">Submit</button>

jQuery：

$('.values').click(function(){  
       var checkboxes_value = []; 

       $('.cb').each(function(){  
            //if($(this).is(":checked")) { 
            if(this.checked) {              
                 checkboxes_value.push($(this).val());                                                                               
            }  
       });                              
       checkboxes_value = checkboxes_value.toString(); 

       $.ajax({  
            url:"",  
            method:"POST",  
            data:{ checkboxes_value:checkboxes_value },  
            success:function(data){  
                 $('.echo').html(data);  
            }  
       });  
    });

PHP：

if(isset($_POST["checkboxes_value"])) {  
  $result = $_POST["checkboxes_value"];  
  echo  '<br />'.$result.'<br />';
}

如何根据相同的过程和相同的Ajax调用来回显输入字段的值？

所以我的HTML将是：

<input type="checkbox" class="cb" value="PHP" /> PHP <br />  
<input type="checkbox" class="cb" value="ASP" /> ASP <br />  
<input type="checkbox" class="cb" value="JSP" /> JSP <br />  
<input type="text" class="text" value="" />

<button type="button" class="values">Submit</button>

Answer 1

所以您可以通过这种方式

<input type="text" class="text" value="" />

您的jquery

$('.values').click(function(){  
       var checkboxes_value = []; 
        var inputval=$(".text").val();//getting value of input field
       $('.cb').each(function(){  
            //if($(this).is(":checked")) { 
            if(this.checked) {              
                 checkboxes_value.push($(this).val());                                                                               
            }  
       });                              
       checkboxes_value = checkboxes_value.toString(); 

       $.ajax({  
            url:"",  
            method:"POST",  
            data:{ checkboxes_value:checkboxes_value,inputval:inputval},  
            success:function(data){  
                 $('.echo').html(data);  
            }  
       });  
    });

您的php代码

if(isset($_POST["checkboxes_value"]) && isset($_POST["inputval"]) ) {  
  $result = $_POST["checkboxes_value"];  
  echo  '<br />'.$result.'<br />';
echo  '<br />'.$_POST["inputval"].'<br />';
}

Answer 2

我不确定为什么要使用AJAX，因为您只返回通过AJAX发送的值。怎么做呢？

$('.values').click(function(){
    var checkboxes_value = []; 

    $('input').each(function(){
        if(this.checked) {
            checkboxes_value.push($(this).val());
        }else if($(this).hasClass('text')){
            checkboxes_value.push($(this).val());
        }
    });                              

    checkboxes_value = checkboxes_value.toString(); 
    $('.echo').html(checkboxes_value);
});

div.echo{margin-top:50px;background:wheat;padding:50px;border:1px solid red;}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>

<input type="checkbox" class="cb" value="PHP" /> PHP <br />  
<input type="checkbox" class="cb" value="ASP" /> ASP <br />  
<input type="checkbox" class="cb" value="JSP" /> JSP <br />  
<input type="text" class="text" value="" />

<button type="button" class="values">Submit</button>

<div class="echo"></div>

注意：

由于您要测试的元素都是input元素，因此您可以遍历所有输入元素。
不需要AJAX，因为它仅回显收到的内容。您可以只在javascript / jQuery中做您想做的事。

Answer 3

也许是一个简单的foreach循环？

if(isset($_POST["checkboxes_value"])) {  
   foreach($_POST['checkboxes_value'] as $result){
       echo '<input type="checkbox" class="cb" value="' . $result . '" /> ' . $result . ' <br />';
   }
}

如何从复选框中获取值并使用jquery ajax输入

3 个答案: