数据未通过JQuery AJAX请求传递

时间:2014-01-10 19:53:50

标签: javascript jquery html ajax

我对此感到沮丧,无法通过数据。 Firebug一直在向我展示

信=

我试过了

data: {letter: alpha},

data:"letter=" + alpha, 

没有成功。

下面的脚本:

$(document).ready(function(){
    $('#alphaFilter a').click(function(e){
        e.preventDefault();
        var alpha = $(this).val();
        $.ajax({
            type: "POST",
            data: {letter: alpha},
            url: "includes/filterPlants.php",
            success: function(update){
                $('#plants').html(update);
            }
        });
    });
})

下面我的HTML元素(基本上我想过滤没有页面刷新的数据集):

<div id="alphaFilter">
    <a href="#" value="All">All</a>
    <a href="#" value="A">A</a>
    <a href="#" value="B">B</a>
    <a href="#" value="C">C</a>
    <a href="#" value="D">D</a>
    <a href="#" value="E">E</a>
    <a href="#" value="F">F</a>
    <a href="#" value="G">G</a>
    <a href="#" value="H">H</a>
    <a href="#" value="I">I</a>
    <a href="#" value="J">J</a>
    <a href="#" value="K">K</a>
    <a href="#" value="L">L</a>
    <a href="#" value="M">M</a>
    <a href="#" value="N">N</a>
    <a href="#" value="O">O</a>
    <a href="#" value="P">P</a>
    <a href="#" value="Q">Q</a>
    <a href="#" value="R">R</a>
    <a href="#" value="S">S</a>
    <a href="#" value="T">T</a>
    <a href="#" value="U">U</a>
    <a href="#" value="V">V</a>
    <a href="#" value="W">W</a>
    <a href="#" value="X">X</a>
    <a href="#" value="Y">Y</a>
    <a href="#" value="Z">Z</a>
</div>

在此先感谢,我相信这对你们来说非常简单。

3 个答案:

答案 0 :(得分:3)

value属性和jQuery的.val()仅适用于<form><input>元素。

对于其他元素类型,您可以使用data-* attributes存储自定义信息:

<a href="#" data-value="A">A</a>

使用jQuery的.data()

检索它们的值
var alpha = $(this).data('value');

答案 1 :(得分:2)

我相信您的HTML无效(我不相信锚标记支持属性)。此外,jQuery val 方法不会获取锚标记内 value 属性的内容。

如果需要,可以使用HMLT5 data- *属性:

<a href="#" data-value="A">A</a>

$(function(){

    $('#alphaFilter a').click(function(e){
        e.preventDefault();
        var alpha = $(this).attr('data-value');

        $.ajax({
            type: "POST",
            data: {letter: alpha},
            url: "includes/filterPlants.php",
            success: function(update){
                $('#plants').html(update);
            }
        });

    });

})

修改

正如评论中指出的那样,jQuery .data()方法也可以用于此目的。这两个都将获得“数据值”的价值:

$(this).data("value");

//or

$(this).attr("data-value");

答案 2 :(得分:0)

var alpha = $(this).attr("value")