#javascript #checkbox
Вопрос:
Мне нужен флажок на веб-странице. Когда я нажимаю на него, он отправляет ajax-запрос на сервер. Когда сервер ответит, я хочу, чтобы флажок изменился. Я могу исправить все, кроме того факта, что флажок немедленно меняет состояние при нажатии.
Ответ №1:
Ты уверен, что действительно этого хочешь? Ajax-запрос может занять некоторое время. Когда пользователь не получает обратной связи, он может быть склонен нажимать снова и снова, пока что-то не произойдет. Когда это деактивирует кнопку (снова через некоторое время), пользователь становится еще более озадаченным.
Лучше подумайте о предоставлении немедленной обратной связи (например, установите флажок) и отобразите рядом с ним индикатор, который сигнализирует о связи с сервером (например, знаменитое вращающееся колесо). Когда результат вернется, спрячьте индикатор и при необходимости снимите флажок. Вы также можете запретить публикацию формы во время запроса ajax.
Ответ №2:
Вероятно, вы могли бы сделать что-то вроде этого: когда флажок установлен, установите флажок «отключен» (этот флажок становится серым и делает его недоступным для редактирования), выполните вызов ajax и, как только вы получите ответ ajax, удалите «отключен» из флажка. Что-то вроде этого (с использованием jQuery, непроверенного):
$('#mycheckbox').click( function() {
var checkbox = this;
$(checkbox).attr('disabled','1');
$.post( url, data, function() {
// if successful
$(checkbox).removeAttr('disabled');
}
}
Ответ №3:
Добавьте в свой onclick «return false;», и это не должно измениться.
Комментарии:
1. В некоторых браузерах вы можете видеть, как он включается и выключается. И если вы выполняете какое-либо другое действие синхронно, прежде чем возвращаете false, флажок будет оставаться включенным до тех пор, пока ваш код не достигнет инструкции return.
Ответ №4:
<input id="theChkbox" type="checkbox" onclick="this.checked=!this.checked;sendAjaxRequest(this);">
this.checked=!this.checked
сбросит состояние флажка до того, каким оно было до того, как на него нажали. Это должно работать во всех браузерах без мерцания состояния (слишком сильно).
sendAjaxRequest()
сделает ваше волшебство, и когда запрос вернется, установите соответствующий флажок в отмеченном состоянии. Переход this
к sendAjaxRequest()
должен дать вам ссылку на флажок, чтобы вы могли настроить его состояние. В противном случае просто используйте document.getElementById("theChkbox")
для получения ссылки на него, чтобы установить его состояние.
Ответ №5:
Вы можете начать свой метод onchange с checkbox.checked=NOT checkbox.checked
(возможно, вам придется изменить его для выбранного вами языка), вы, вероятно, получите мерцание, но оно должно вернуть его достаточно быстро.
Комментарии:
1. Я всегда думал, что это флажок.проверено=ложь, которую я никогда не видел = НЕ раньше. Ну, я думаю, что если «НЕТ» не определено, это может сработать.
2. Я использую vbscript, все, что делает, — это отменяет настройку checkbox.checked, в любом случае. Кстати, с vbscript ужасно работать.
Ответ №6:
Я думаю, что вам действительно следует использовать другой подход. Возможно, кнопка/кнопка изображения, потому что вы хотите выполнить некоторые действия для нажатия, чтобы представить конкретную команду (желание) пользователя. Я постараюсь объяснить лучше: я думаю, что у вас есть некоторая информация на странице и некоторые гаджеты, на которых пользователь может щелкнуть и что-то сделать (добавить товар в корзину), и я думаю, что это более удобно, если гаджет имеет большую визуальную привлекательность для пользователя, чем флажок (например, «добавить его»).
Надеюсь, это поможет.