0

我想在不重新加载页面的情况下将 jquery 值“selected”传递给 fetchdata.php。我怎样才能做到这一点？

这是我的代码：

<!DOCTYPE html>
<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" 
        type="text/javascript"></script>

        <script src="http://code.jquery.com/ui/1.9.1/jquery-ui.min.js" type="text/javascript">
        </script>
        <script>
            $(document).ready(function() {
                $("#buttonClass").click(function() {
                    getValueUsingClass();
                });
            });
            function getValueUsingClass() {

                var chkArray = [];

                $(".chk:checked").each(function() {
                    chkArray.push($(this).val());
                });

                /* we join the array separated by the comma */
                var selected;
                selected = chkArray.join('#') + "#";

                if (selected.length > 1)
                {
                    $.ajax({
                        url: "fetchdata.php", //This is the page where you will handle your SQL insert
                        type: "GET",
                        data: "val=" + selected, //The data your sending to some-page.php
                        success: function()
                        {
                            console.log("AJAX request was successfull");
                        },
                        error: function()
                        {
                            console.log("AJAX request was a failure");
                        }
                    });

                    //alert("You have selected " + selected); 
                } else
                {
                    alert("Please at least one of the checkbox");
                }
            }
        </script>
    </head>
    <body>
        <div id="checkboxlist">
            <div><input type="checkbox" value="1" class="chk"> Value 1</div>
            <div><input type="checkbox" value="2" class="chk"> Value 2</div>
            <div><input type="checkbox" value="3" class="chk"> Value 3</div>
            <div><input type="checkbox" value="4" class="chk"> Value 4</div>
            <div><input type="checkbox" value="5" class="chk"> Value 5</div>
            <div>
                <input type="button" value="Get Value Using Class" id="buttonClass"> 
            </div>
</html>

获取数据.php

<?php
    foreach($_GET['val'] as $r)
    {
        print_r($r);
    }
?>

我正在使用 GET 方法接收数据并使用 for-each 循环来打印数组，但我没有在 PHP 文件中获取任何值。

4

3 回答 3

2

像下面这样更改 ajax 函数，并确保 fectdata.php 在同一文件夹中或提供正确的路径。

$.ajax({
    url: 'fetchdata.php',
    type:'GET',
    data: {val:selected},
    success: function(data) {
        console.log("AJAX request was successfull");
    }
});
于 2013-08-20T04:57:49.720 回答
1

Check if the path to your script is correct:

url: 'fetchdata.php',

Is this script in your doc root?

于 2013-08-20T05:02:28.223 回答
0

在您的代码中更改以下内容，在 fetchdata.php

<?php 
$valArray = explode('@',$_GET['val']); 
foreach($valArray as $val){
echo $val."<br/>";
}
?>

在 html 文件中，

$(document).ready(function () {

$("#buttonClass").click(function() {
getValueUsingClass();
});

});

function getValueUsingClass(){ 
var chkArray = [];

$(".chk:checked").each(function() {
chkArray.push($(this).val());
}); 
/* we join the array separated by the comma */
var selected;
selected = chkArray.join('@') + "@";
if(selected.length > 1)
{ 
$.ajax({
url: "fetchdata.php", //This is the page where you will handle your SQL insert
type: "GET",
data: "val=" +selected.toString(), //The data your sending to some-page.php
success: function(data1) {  
$("#resultDiv").html(data1);
console.log("AJAX request was successfull");
},
error:function()
{
console.log("AJAX request was a failure");
}   
});

//alert("You have selected " + selected); 
}else
{
alert("Please at least one of the checkbox");   
}
}

在按钮之后包含 div

<div id="resultDiv"></div>
于 2013-08-20T05:35:18.457 回答