我很接近,但错过了一些东西。我试图使用 jquery 将多个复选框的变量传递给 php 页面。我的代码:
<div id="students">
<div class="field">
<label>
<input type="checkbox" name="pupil[a]" value="a" id="pupil"/>
Pupil A
</label>
</div>
<div class="field">
<label>
<input type="checkbox" name="pupil[b]" value="b" id="pupil"/>
Pupil B
</label>
</div>
<div class="field">
<label>
<input type="checkbox" name="pupil[c]" value="c" id="pupil"/>
Pupil C
</label>
</div>
</div>
<br /><br />
<div id="occupation">
<div class="field">
<label>
<input type="checkbox" name="occupation[Software]" value="Software" id="occupation"/>
Software
</label>
</div>
<div class="field">
<label>
<input type="checkbox" name="occupation[Marketing]" value="Marketing" id="occupation"/>
Marketing
</label>
</div>
<div class="field">
<label>
<input type="checkbox" name="occupation[Teacher]" value="Teacher" id="occupation"/>
Teacher
</label>
</div>
</div>
我的查询:
$(document).ready(function(){
$(":checkbox").on('change', function() {
var val = [];
var myval = []; //defining to pass with AJAX
var theval =[]; //defining to pass with AJAX
$(':checkbox:checked').each(function(i){
myval[i] = $(this).attr('id');
theval[i] = $(this).attr('name');
var newval = myval[i] +"="+ myval[i];
$.ajax({
type: "POST",
url: 'draftdata.php',
data : { newval}, //tried this and
data : {myval : theval}, // and tried this too
success: function(data){
$("#result").html(data);
}
});
});
});
});
我只想将复选框中选中的数据传递给 php。可能有多个复选框组,因此无法定义$_POST['desiredValue']
。所以我只能检查它是否由if(isset($_POST['desiredValue']))
设置.
当我检查软件,营销和教师以及草稿数据时.php做一个print_r($_POST[])
,我得到:
Array
(
[myval] => Array
(
[0] => Software
[1] => Marketing
[2] => Teacher
)
)
我想要得到的是:
Array
(
[0] => 'occupation' = 'Software'
[1] => 'occupation' = 'Marketing'
[2] => 'occupation' = 'Teacher'
)
我错过了什么?
谢谢。
我以这种方式修改了您的 html 代码,
<form id="myform" class="" action="draftdata.php" method="post">
<div id="students">
<div class="field">
<label>
<input type="checkbox" name="pupil[]" value="a" id="pupil" /> Pupil A
</label>
</div>
<div class="field">
<label>
<input type="checkbox" name="pupil[]" value="b" id="pupil" /> Pupil B
</label>
</div>
<div class="field">
<label>
<input type="checkbox" name="pupil[]" value="c" id="pupil" /> Pupil C
</label>
</div>
</div>
<br />
<br />
<div id="occupation">
<div class="field">
<label>
<input type="checkbox" name="occupation[]" value="Software" id="occupation" /> Software
</label>
</div>
<div class="field">
<label>
<input type="checkbox" name="occupation[]" value="Marketing" id="occupation" /> Marketing
</label>
</div>
<div class="field">
<label>
<input type="checkbox" name="occupation[]" value="Teacher" id="occupation" /> Teacher
</label>
</div>
</div>
<button type="button" name="button" id="fsubmit">Submit</button>
</form>
通过添加表单和
<button type="button" name="button" id="fsubmit">Submit</button>
然后使用按钮的 id #fsubmit
到我们的 jQuery 中。
<script type="text/javascript">
$(document).ready(function() {
$("#fsubmit").click(function(e) {
var val = [];
var id = []; //defining to pass with AJAX
var name = []; //defining to pass with AJAX
var val = [];
$('input:checkbox:checked').each(function(i, v){
id[i] = $(this).attr('id');
name[i] = $(this).attr('name');
val[i] = $(this).val();
});
var url = $('#myform').attr('action');
$.ajax({
url: url,
type: "POST",
dataType: 'json',
data : {
'id': id,
'name': name,
'val': val
},
success: function(data) {
// $("#result").html(data);
console.log(data);
}
});
});
});
</script>
请注意,我更改了一些变量,根据您的需要更改它,
var val = [];
var id = []; //defining to pass with AJAX
var name = []; //defining to pass with AJAX
var val = [];
并添加了此
var url = $('#myform').attr('action');
而且,dataType: 'json'
,
jQuery做什么,当用户单击按钮时,从表单操作中获取链接并查找选中的值并将其发送到PHP。
这里是 PHP 的示例
<?php
if ( isset($_POST['id']) ) {
$temp['id'] = $_POST['id'];
}
if ( isset($_POST['name']) ) {
$temp['name'] = $_POST['name'];
}
if ( isset($_POST['val']) ) {
$temp['val'] = $_POST['val'];
}
$data['data'] = $temp;
echo json_encode($data);
检查您的日志以获取结果,
希望这个帮助