Использование this в функциях jQuery - PullRequest
1 голос
/ 30 июля 2010

Я создал JS-объект пользовательского объекта CalendarViewerPortlet.В этом объекте я храню такие вещи, как идентификатор портлета и его контекстный путь.У объекта также есть много пользовательских методов, некоторые для получения / установки переменных-членов и некоторые для выполнения определенных действий.

Когда я пытаюсь ссылаться на функцию объекта, используя «this».внутри функции jQuery он взрывается.Я понимаю, что термин «это» в этом контексте, вероятно, относится к чему-то другому, но я не уверен, как обойти проблему и заставить ее ссылаться на объект, как я хочу.

Вотнарушающий код:

jQuery.ajax({
  url: jQuery(formSel).attr("action"), 
  type: "POST", 
  data: jQuery(formSel).serialize(), 
  beforeSend: function(xhr) {
  jQuery(msgSel).hide();
  jQuery(msgSel).html("");
  jQuery(tableSel).hide();
  jQuery(pagerSel).hide();
  jQuery(cpSelector).block({
  message: "<img src='"+this.getContextPath()+"/images/icon_loading.gif' align='absmiddle' alt='Loading...' /> Fetching events..."
  });
},

Обратите внимание на "this.getContextPath ()".Вот где код не работает.Я пытаюсь сослаться на функцию getContextPath () моего пользовательского объекта.Как я могу это сделать?

Ответы [ 6 ]

6 голосов
/ 30 июля 2010

Проблема в том, что код this.getContextPath () выполняется позже в анонимной функции, передаваемой как опция функции ajax (). Поэтому «this» (ваш пользовательский объект JS), который вы хотите, не будет доступен в момент выполнения метода. Вы можете сохранить его в переменной и позволить функции «закрыть» ссылку. Должно работать следующее:

var calendarViewer = this;

jQuery.ajax({
  url: jQuery(formSel).attr("action"), 
  type: "POST", 
  data: jQuery(formSel).serialize(), 
  beforeSend: function(xhr) {
  jQuery(msgSel).hide();
  jQuery(msgSel).html("");
  jQuery(tableSel).hide();
  jQuery(pagerSel).hide();
  jQuery(cpSelector).block({
  message: "<img src='"+calendarViewer.getContextPath()+"/images/icon_loading.gif' align='absmiddle' alt='Loading...' /> Fetching events..."
  });
},
4 голосов
/ 30 июля 2010

возможно попробуйте использовать jQuery(this)

кажется, я вас неправильно понял. В данном примере контекст может вызывать ссылку «this» на объект jQuery. Попробуйте следующий трюк:

function myCode() {
 var th = this;
 $.ajax( ... , th.getContextPath() ... );
}

// что ж, он ссылается на объект jQuery. это потому, что вы не используете отступ для указания, что код вызывается в onBeforeSend :(

1 голос
/ 30 июля 2010

Вы хотите getContextPath() метод из который объект?

Быстрый поиск в Google показывает, что он доступен только Java, а не Javascript.

0 голосов
/ 30 июля 2010

Это проблема связывания.Когда вы вызываете это внутри метода jQuery, он обычно ссылается на DOM- или HTML-элемент, над которым вы выполняете свою задачу.

Я бы рекомендовал lok на

jQuery.proxy ()

, который решает ваши проблемы.

0 голосов
/ 30 июля 2010

Совет: Вам следует ознакомиться с Lexical Scoping в Javascript

Если у вас есть настройка ajax внутри другого объекта, вы можете попробовать ...

{
  //code
  var ObjectSelf = this;

  //refer to your object via ObjectSelf

}
0 голосов
/ 30 июля 2010

Вы можете отправить свой пользовательский объект как это в другой функции, используя call в javascript
например:

function SecondFunc() {
    alert(this.MyVar);
}
function FirstFunc() {
    var obj = {MyVar:"Test"}
    SecondFunc.call(obj);
}

в теле

<input type="button" onclick="FirstFunc()" value="test" />

просто вызовите FirstFunc () в событии, и он выполнит SecondFunc () с вашим пользовательским this.

В вашем случае

function raiseSendRequest()
{
sendRequest.call(YourCustomObject);
}

function sendRequest()
{

jQuery.ajax({
  url: jQuery(formSel).attr("action"), 
  type: "POST", 
  data: jQuery(formSel).serialize(), 
  beforeSend: function(xhr) {
  jQuery(msgSel).hide();
  jQuery(msgSel).html("");
  jQuery(tableSel).hide();
  jQuery(pagerSel).hide();
  jQuery(cpSelector).block({
  message: "<img src='"+this.getContextPath()+"/images/icon_loading.gif' align='absmiddle' alt='Loading...' /> Fetching events..."
  });
}


Надеюсь, что это работает

...