Привет, У меня проблемы со сценарием ниже. Проблема, на мой взгляд, заключается в данных, которые необходимо отправить на php через AJAX.
JQuery
$('.send').live("click", function(){ $.ajax({ url:'foobar.php', type:'post', data: 'id=' + $(this).attr('id'), dataType:'json', contentType: 'application/json; charset=utf-8', success: function(data) { switch (data.status) { case "a": alert(data.text); break; case "b": alert(data.text); break; } }, error: function(XMLHttpRequest, textStatus, errorThrown) { alert ("error: "+textStatus); } }) } и PHP
$id = $_REQUEST['id']; switch ($id) { case "foo": $data["status"] = "a"; $data["text"] = "foo-foo"; echo json_encode($data); break; case "bar": $data["status"] = "b"; $data["text"] = "bar-bar"; echo json_encode($data); break; }
но, если я это сделаю
//data: 'id=' + $(this).attr('id'),
и измените это
$id = 'foo';
сценарий работает отлично. Что мне нужно сделать, чтобы сделать оба сценария выше, может работать? Заранее спасибо.
Я отвечу на мой комментарий в качестве ответа.
Помимо использования устаревшего API jQuery, другие не указали следующее:
Что вы делаете в следующей строке:
contentType: 'application/json; charset=utf-8',
заключается в том, что вы обещаете серверу, что объект HTTP будет JSON-строкой, что не так. Это обычная строка, закодированная в процентилях. ( a=b&c=d&e=f ).
Если вы удалите эту строку, браузер отправит значение Content-Type по умолчанию как application/x-www-url-form-encoded . Это заставило бы PHP разобрать HTTP-объект как таковой и дать вам как правильно заполненный массив $_REQUEST .
изменить это
data: 'id=' + $(this).attr('id'),
в
data: {id : $(this).attr('id')},
также использовать здесь, live устарело
$('.send').on("click", function(){
Вы должны JSON кодировать отправляемые данные.
Он должен выглядеть примерно так: '{"id": "' + $ (this) .attr ('id') + '"}'
Вы можете использовать ,
$('.send').click(function(){
Установлено
$('.send').live("click", function(){
Произошла ошибка.
TypeError: Object [object Object] не имеет метода 'live' (live устарел)
В этом вопросе есть несколько вопросов.
Не используйте .live() . Он был устаревшим в jQuery 1.7 и полностью удален в jQuery 1.9 (последняя версия). Вместо этого используйте .on() :
$('.send').on('click', function() { ... });
Или, если вам действительно нужна делегирование событий:
$(document).on('click', '.send', function() { ... });
При установке свойства data в литеральном объекте, переданном как аргумент $.ajax() , у вас есть два варианта: строка или литерал объекта. Итак, либо:
data: {id: this.id},
или
data: 'id=' + this.id,
Обратите внимание, что я использую this.id , а не $(this).attr('id'); , Зачем? Поскольку он избегает ненужного использования jQuery и потому что .attr() не является правильной функцией – вы хотите свойство id , поэтому вы должны использовать .prop() (хотя, опять же, не используйте jQuery, если вам не нужно) ,
Наконец, вы не закрыли вызов .click() , поэтому вам нужно добавить a ); до конца вашего опубликованного кода.
Вся вещь должна выглядеть примерно так:
$('.send').on("click", function () { $.ajax({ url: 'foobar.php', type: 'post', data: 'id=' + this.id, dataType: 'json', contentType: 'application/json; charset=utf-8', success: function (data) { switch (data.status) { case "a": alert(data.text); break; case "b": alert(data.text); break; } }, error: function (XMLHttpRequest, textStatus, errorThrown) { alert("error: " + textStatus); } }) });