Question

我已经用ajax为学校的留言簿制作了一个表单，只是它一直发送未定义而不是值。

jquery代码：

$(".forum-index.admin-table tr .save").click(function(){
    var id = '';
    var id = $(this).attr("id");
    alert($("."+id+" #volgorde").val());
    $.ajax({
        type: "POST",
        url: site_url+"content/order_cat.php",
        data: 'submit=submit&title='+ $("."+id+" #title").val() +'&desc='+ $("."+id+" #desc").val() +'&volgorde='+ $("."+id+" #volgorde").val() +'&zichtbaar='+ $("."+id+" #zichtbaar").val() +'&id='+id,
        success: function(html) {
            $(".forum-index.admin-table")
                        .fadeOut("fast")
                        .empty()
                        .trigger("destroy")
                        .append(html)
                        .fadeIn("fast");
            click();
        }
    });
});

Html：

<table width='100%' class='forum-index tables admin-table' cellpadding='0' cellspacing='0'>
<tr class='top'><td><h3>General</h3></td><td>topics</td><td colspan='3'>order</td></tr>                             
<tr class='2'>
    <td><span><a href='#'>test cat onzichtbaar</a></span>
            <br><small>Deze categorie is nu alleen zichtbaar voor de admins</small>
    </td>
    <td>0</td>
    <td><input type='text' name='volgorde' id='volgorde' value='2' style='width:40px;' /></td>
        <td><input type='checkbox' title='visibility' id='zichtbaar' value='aan' name='zichtbaar' checked /></td>
        <td id='2' class='imgFade save'>&nbsp;<img src="http://bas-peters.nl/Forum2/images/save.png"><img src="http://bas-peters.nl/Forum2/images/save_color.png"></td>
</tr>
</table>

Answer 1

我会按如下方式重写：

function traceMsg(msg) {
    // Comment the function to disable logging; 
    // This works in Google Chrome and Firefox.        
    console.log(msg);
}

$(".forum-index.admin-table tr .save").click(function(){

    // this statement is unnecessary
    // var id = ''; 
    var id = $(this).attr("id");
    traceMsg("id = " + id); // this is generally useful to see what happens in your source code
    traceMsg("title = " + $("."+id+" #title").val()); // if your tag with 'title' ID is not unique, it is plain wrong (see http://stackoverflow.com/questions/3405351/jquery-basic-selector-usage-and-non-unique-element-id). Much more reasonable seems to use the selector $("#"+id+" .title").

    // Use an object rather than query string to specify data you want to post.
    var dataObject = {
        submit: "submit",
        title: $("."+id+" #title").val(),
        desc: $("."+id+" #desc").val(),
        // and so on
    };

    traceMsg("dataObject = ");        
    traceMsg(dataObject);
    traceMsg("Submitting data to " + site_url+"content/order_cat.php");
    $.ajax({
        type: "POST",
        url: site_url+"content/order_cat.php",
        data: dataObject ,
        success: function(html) {
            traceMsg(html);
            $(".forum-index.admin-table")
                        .fadeOut("fast")
                        .empty()
                        .trigger("destroy")
                        .append(html)
                        .fadeIn("fast");
            click();
        }
    });
});

注意：您输入查询字符串：

data: 'submit=submit&title='+ $("."+id+" #title").val() + ....

现在考虑当$("."+id+" #title").val()返回类似rock&roll的字符串时会发生什么。查询字符串将是错误的，因为您没有转义＆符号！对象dataObject以安全的方式转换为查询字符串（即正确完成转义）。

Answer 2

我做了一些研究。我需要使用.prop（“value”）而不是.val（）。现在它可以工作，直到ajax加载更新版本。

Ajax不断发送undefined

2 个答案: