jquery在单选点击中意外标记

Question

这是我的代码

// when the DOM is ready
    $(document).ready(function() {
    // 'click' because IE likes to choke on 'change'
    $('input[name=passedparameter]').click(function(e) {
        // prevent normal, boring, tedious form submission
        e.preventDefault();
        // send it to the server out-of-band with XHR
        $.post('http://localhost/topostthepost.php', function() {
            data: $(this).val(),
            success: function(resp) {
                if(resp == '1') {
                    alert('Saved successfully');
                } else {
                    alert('Oops, something went wrong!');
                }
            }
        });
    });
});

我对jQuery是个新手，即使是在javascript中，

但据我所知，这在逻辑上是可能的，也是正确的代码，

我打开了回复页面(http://localhost/topostthepost.php)，我做得很好，

使用php框架的-im，所以我需要发布"http://localhost/“，这样我就得到了正确的url，

-when我运行页面，它不会做任何事情，我检查元素(Chrome)它，它警告unexpected token

我错过了什么？jquery/javascript是否拒绝$.post中的http://？

PS:代码积分到karim79

Answer 1

这很微妙：

// when the DOM is ready
    $(document).ready(function() {
    // 'click' because IE likes to choke on 'change'
    $('input[name=passedparameter]').click(function(e) {
        // prevent normal, boring, tedious form submission
        e.preventDefault();
        // send it to the server out-of-band with XHR
        $.post('http://localhost/topostthepost.php', function() {
        // Problem is here ========================= ^^^^^^^^^^   <<==========
            data: $(this).val(),
            success: function(resp) {
                if(resp == '1') {
                    alert('Saved successfully');
                } else {
                    alert('Oops, something went wrong!');
                }
            }
        });
    });
});

它不应该有function，你传递的是一个对象。使用function，success之后的:会变成一个语法错误。( data后面的那个很好，因为它看起来像一个标签，但是行尾的逗号表示我们仍然在一个表达式中，所以success后面的:是罪魁祸首。)

但请注意，这不是调用$.post的方式，它类似于调用$.ajax的方式。下面是没有语法错误并切换到$.ajax的更新代码

// when the DOM is ready
    $(document).ready(function() {
    // 'click' because IE likes to choke on 'change'
    $('input[name=passedparameter]').click(function(e) {
        // prevent normal, boring, tedious form submission
        e.preventDefault();
        // send it to the server out-of-band with XHR
        $.ajax({
            url:     'http://localhost/topostthepost.php',
            type:    'POST',
            data:    $(this).val(),
            success: function(resp) {
                if(resp == '1') {
                    alert('Saved successfully');
                } else {
                    alert('Oops, something went wrong!');
                }
            }
        });
    });
});

然而，这一点看起来仍然不可靠：

data:    $(this).val(),

这意味着您正在将一个字符串传递给调用。如果你给了一个字符串，它必须已经被正确编码了。因此，您必须对其进行编码，或者传递一个对象，以便jQuery可以对其进行编码：

data:    {someParameterName: $(this).val()},

...where someParameterName是服务器将在表单数据服务器端查找的内容。这是将一个对象作为data参数传递给调用。该对象(在本例中)只有一个属性，我在上面已将其称为someParameterName，值来自$(this).val()。

当您向系统发送POST时，默认情况下它是application/x-www-form-urlencoded数据，它基本上由名称和值组成-例如，表单字段名称和这些字段的值。因此，在上面的代码中，我发送了一个字段名someParameterName和来自$(this).val()的值。因为我们将data作为对象传递，所以jQuery将为我们处理名称和值的编码。

在接收POST的服务器上，它将使用字段名someParameterName)查看post数据以获取值。

显然，您应该使用比someParameterName更合适的参数名称。

下面是一个给出多个字段的假设示例：

data: {
    firstName: $("input[name=firstName]").val(),
    lastName:  $("input[name=lastName]").val()
}

我在这里发布了两个字段(参数)，名称分别为firstName和lastName。

Answer 2

我认为错误是因为这行$.post('http://localhost/topostthepost.php', function() {

试试这个：

$(document).ready(function() {
    // 'click' because IE likes to choke on 'change'
    $('input[name=passedparameter]').click(function(e) {
        // prevent normal, boring, tedious form submission
        e.preventDefault();
        // send it to the server out-of-band with XHR
        $.post('http://localhost/topostthepost.php', {data: $(this).val()}, function(resp) {
            if (resp == '1') {
                alert('Saved successfully');
            } else {
                alert('Oops, something went wrong!');
            }
        });
    });
});