使用jQuery Ajax将javascript变量发送到PHP脚本

时间:2015-03-04 16:04:23

标签: javascript php jquery ajax

我正在尝试使用ajax将JavaScript变量发送到php脚本。这是我第一次使用ajax,我不知道哪里出错了。这是我的代码

function selectcat(v) {
        $.ajax({

        type: "GET",
        url: "myurl.php",
        dataType: "script",
        data: { "selected_category" :  v}
    }).done(function() { 
    window.location.href = "http://mywebsite.com";

    });
        }

感谢所有帮助

这是HTML

<ul class="cat">
<li class="opt" onclick="selectcat('option1')">option1</li>
<li class="opt" onclick="selectcat('option2')">Option 2</li>

</ul>

这是ajax php文件

<?php
session_start();
$ctgry = $_GET['selected_category'];
$_SESSION['select_cat'] = $ctgry;
?>

4 个答案:

答案 0 :(得分:1)

您需要删除dataType: "script",因为您只是发送数据。这样做:

 function selectcat(v) {
        $.ajax({
            type: "GET",
            url: "myurl.php",
            data: {"selected_category": v}
        }).done(function(result) {
            console.log(result);
            //window.location.href = "http://mywebsite.com";
        });
 }

答案 1 :(得分:0)

嗨,这就是我所做的调用ajax请求的方法 您可以使用以下代码发布数据或加载文件:

 $("#button click or any other event").click(function(){
try
  {
    $.post("my php page address",
      {
         'Status':'6',
         'var one':$("#myid or .class").val().trim(),
         'var 2':'var 2'
     }, function(data){
           data=data.trim();
      //   alert(data);
// this  data is data that the server sends back in case of ajax request you 
//can send any type of data whether json or or json array or any other type 
//of data

         });
    }
    catch(ex)
    {
        alert(ex);
    }
  });

我希望这有帮助!

答案 2 :(得分:0)

dataType: "script"在这里没有任何意义,我认为您需要json或将其留空。

如果您尝试使用$_GET['selected_category']

获取变量,那么您的PHP脚本应该有效

我建议您进行此修改以帮助自己进行调试

$.ajax({
    type: "GET",
    url: "myurl.php",
    data: { "selected_category" :  v},
    success: function(data){
      console.log(data);
      // you can also do redirection here (or in complete below)
    },
    complete: function(data){
      // when request is done, independent of success or error.
    },
    error: function(data){
      // display things to the user
      console.error(data);
    }
})

答案 3 :(得分:0)

AJAX比听起来更容易。你只需要看一些好的例子。

试试这些:

A simple example

More complicated example

Populate dropdown 2 based on selection in dropdown 1


以上示例说明了一些事项:

(1)AJAX请求有四种格式 - 完整的$.ajax()结构和三种快捷结构($.post()$.get()和{ {1}})

在你非常擅长AJAX之前,我建议使用格式正确的$.load()代码块,这就是上面的例子所示。这样的代码块看起来像这样:

$.ajax()

(2)在$('#divID').click({ $.ajax({ type: 'post', url: 'contact.php', dataType: 'json', data: 'email=' + form.email.value }).done(function(data) { if ( typeof(data) == 'object' ) { if ( data.status == 'valid') { form.submit(); } else if(data.status !=='valid' { alert('The e-mail address entered is wrong.'); return false; } else { alert('Failed to connect to the server.'); return false; } } }); }); 代码块中,$.ajax()行指定发送到PHP处理器文件的数据。

(3)data:行指定ajax代码块期望从 PHP处理器文件接收的数据类型。除非另有说明,否则默认的dataType为html。

(4)在PHP处理器文件中,数据通过dataType:命令返回到AJAX代码块。无论该数据是以html,text还是json的形式返回,它都会echo返回到AJAX例程,如下所示:

echo

请亲自尝试上面几个例子,你会看到它是如何运作的。

没有必要使用<?php //perform MySQL search here. For eg, get array $result with: $result['firstname'] and $result['lastname'] $out = '<div id="myresponse">'; $out .= 'First Name: <input type="text" value="' .$result['firstname']. '" />'; $out .= 'Last Name: <input type="text" value="' .$result['lastname']. '" />'; $out .= '</div>'; echo $out; 来发送/返回数据。但是,json是发送 数组 数据的有用格式,但正如您所看到的,您可以在PHP端构建完整的html响应并回显完成的标记。


所以,你只需要json支持一些数据。这是PHP文件的工作:

(1)从AJAX例程接收数据

(2)在某种查找中使用该数据(通常在数据库中),

(3)构建一个回复,

(4)echo(非echo)回复AJAX例程的returnsuccess:函数。


您的示例可能会更改为:

<强> HTML:

.done()

<强>的javascript / jQuery的:

<ul class="cat">
    <li class="opt" value="TheFirstOption">option1</li>
    <li class="opt" value="The Second Option">Option 2</li>
</ul>

<强> PHP:

$('.opt').click(function(){
    var v = $(this).val();
    $.ajax({
        type: "POST",
        url: "myurl.php",
        dataType: "html",
        data: { "selected_category" :  v}
    }).done(function(data) { 
        $('#div_to_insert_the_response').html(data);
    });
});