1

我想增强我的工具页面，一旦使用单击按钮。请求转到服务器并根据返回类型（失败/通过）我更改按钮的颜色。没有刷新/页面重新加载

页面有多个按钮：一些如下所示。

Name       9-11  -  11-2      2-5

Resource1 - Button - Button - Button 

Resource2 - Button - Button - Button 

Resource1 - Button - Button - Button

我是一名 C++ 程序员，所以你可能会觉得我问了一个简单的问题

4

3 回答 3

2

这是一个 jQuery Ajax 发布的示例Form。就个人而言，我不熟悉 PHP，但无论如何 Ajax 都是一样的。您只需要发布到可以返回的内容Success = true或false. success:此 POST 异步发生，因此除非您在该部分中执行特定操作，否则您不会刷新页面。

$("document").ready(function () {

    $('form').submit(function () {
        if ($(this).valid()) {
            $.ajax({
                url: yourUrlHere,
                dataType: "json",
                cache: false,
                type: 'POST',
                data: $(this).serialize(),
                success: function (result) {
                    if(result.Success) {
                        // do nothing
                    }                           
                }
            });
        }
        return false;
    });
});

当然你也不必这样做POST，它可以是GET

type: 'GET',

如果您不需要传递任何数据，只需保留data:部分即可。但是如果你想指定你可以使用的数据data: { paramName: yourValue },

cache: false,如果要缓存页面，可以省略该行。鉴于您不会显示任何更改，您可以删除该行。jQuery 将一个唯一值附加到 Url 以防止它被缓存。指定type: "json",或任何您的特定类型始终是一个好主意，但不是必需的。

于 2012-05-27T04:04:31.013 回答
1

尝试在 jquery 中使用 $.post 或 $.get 函数

$.post("url",$("#myform").serialize());

按照 Fabrício Matté 的建议添加回调函数

$.post("url",$("#myform").serialize(),function(data){alert(data);$("#myform").hide()//?Do something with the returned data here});
于 2012-05-27T04:03:09.093 回答
1

干得好。你会发现一个表单的例子，一个按钮一个必要的ajax处理php页面。试试看，让我们知道它是怎么回事：

<form action="" method="post" name="my_form" id="my_form">
  <input type="submit" name="my_button" id="my_button" value="Submit">
</form>


<script type="text/javascript">
$("document").ready(function () {

    $('#my_form').submit(function () {

        $.ajax({
                url: "ajaxpage.php",
                dataType: "json",
                type: "POST",
                data: $(this).serialize(),
                success: function (result) 
                    {
                        //THere was an error
                        if(result.error) 
                        {
                            //So apply 'red' color to button
                            $("#my_button").addClass('red');
                        }
                        else
                        {
                            //there was no error. So apply 'green' color
                            $("#my_button").addClass('green');  
                        }
                    }                           
            });

        return false;
    });
});
</script>

<?php 
//ajaxpage.php
//Do your processing here

if ( $processed )
{
    $error = false;
}
else
{
    $error = true;  
}

print json_encode(array('error' => $error));
die();

?>
于 2012-05-27T05:12:43.990 回答