ajax post为我提供了不同输入的相同值和id

时间:2012-01-05 17:32:08

标签: jquery ajax post

我被困在这一部分。

试图让一个简单的AjaxPost从输入的文本框中发布一些值。但我无法弄清楚的问题是它发布了第一个输入的id和值... 并且对所有人来说输入

Javascript代码

<script type="text/javascript">
    $(function () {
        $('.hexen1').after('<span class="ui-state-default ui-corner-all ui-icon-disk ui-icon onopordon" onClick="save();" title="Save" style="float:left; height:20px;" onclick="save ()"></span><br />')// ui icon
    .keypress(function() {
        $(this).next('.onopordon').show();//appends ui icon
    });

$('.onopordon').hide().click(function() {
    $(this).hide(); // removes ui icon on click
});

$('.ui-state-default').hover(
    function () { $(this).addClass('ui-state-hover'); },
    function () { $(this).removeClass('ui-state-hover'); } //ui icon hover
);
});

function save() {
  $.ajax({
    url: "Default.aspx",
    type: "POST",
    data: "{ Id: " + $(".hexen1").attr("id") + ", Value: " + $(".hexen1").val() + "}",
    dataType: "json",
    contentType: "application/json; charset=utf-8",
    success: function (data) {
        console.log(data);

        },


});
}
</script> 



HTML

<div id="besen">
<input class="hexen1" id="A1"/>
<input class="hexen1" id="A2"/>
<input class="hexen1" id="A3"/>
<input class="hexen1" id="A4"/>
<input class="hexen1" id="A5"/>
</div>



Firebug读取:
输入“A1”。输入的值为1 ...结果:{ Id: A1, Value: 1}
输入“A2”。输入的值为2 ...结果:{ Id: A1, Value: 1}
输入“A3”。输入的值为3 ...结果:{ Id: A1, Value: 1}
等等...

提前致谢

1 个答案:

答案 0 :(得分:2)

因为您有多个具有“hexen1”类的元素,所以您需要使用$(".hexen1")语句遍历由JQuery语句foreach匹配的元素集合。这将为您提供匹配的每个元素以形成您的对象,以便发布到包含所有表单元素的服务器。