2012-02-14 2 views
1

Это может показаться вам очень легким, но я новичок в jquery и ajax. Я везде искал и не мог решить проблему часами. Моя проблема заключается в следующем;jquery toggle alternative, не мог понять, что здесь происходит

У меня есть HTML ссылка с именем класса следуют

<a href="#" class="follow"> {if $is_following == 0} follow {else} following {/if} </a> 

КРП-другое заявление просто умник использование шаблонов двигателя. это очень просто. если пользователь следит за другим пользователем, тогда отобразите значение «follow», иначе покажите «следующее» значение.

Мой jquery следующий:

var $values; 
$('.follow').mouseover(
    function() 
    { 
     $values = $(this).html(); 
     if($values == 'following') 
     { 
      $(this).html('unfollow'); 
     } 
    } 
); 

$('.follow').mouseout(

    function() 
    { 
     $(this).html($values); 
    } 
); 

$('.follow').toggle(

    function(){ 
     $(this).html('following'); 
     $values = "following"; 
    }, 
    function(){ 
     $(this).html('follow'); 
     $values = "follow";  
    } 
); 

//follow ajax call  
$('.follow').click(function(){ 

    var $op = $(this).html(); 
    var $other_profile_id = $('#other_profile_id').text(); 

    if($op == 'follow') 
    {     
     $.ajax({ 
      type : 'POST', 
      url : 'ajax_service.php', 
      dataType : 'json', 
      data: { 
       op : $op, 
       other_profile_id : $other_profile_id 
      },   
      success : function(data){    

      }, 
      error:function (error){ 
       console.error(error.responseText); 
      }         
     });     
    } 
    else if($op == 'unfollow') 
    {    
     $.ajax({ 
      type : 'POST', 
      url : 'ajax_service.php', 
      dataType : 'json', 
      data: { 
       op : $op, 
       other_profile_id : $('#other_profile_id').text()    
      }, 
      success : function(data){ 
      }, 
      error:function (error){ 
       console.error(error.responseText); 
      } 
     }); 
    } 
}); 

EDIT: На основе ответа мне необходимо объяснить функциональность;

  • Если пользователь не соблюдает, ссылка показывает значение «следовать».
  • Если пользователь уже выполнил, отображается значение «Следующее», оно должно запускать событие mouseover, когда мышь находится над ссылкой.
  • Если мышь находится над ссылкой, а значение «следующее», значение ссылки должно быть «unfollow».
  • Если мышь отсутствует по ссылке, она должна снова показать значение «Следующий».
  • Если пользователь не соблюдает, он показывает значение «следовать» по ссылке.

Я не хочу использовать событие переключения. Потому что переключатель просто ловит первый и второй клики. Мне нужен оператор if, который контролирует, будет ли значение ссылки следовать или следовать.

Кроме того, если пользователь следует, он показывает следующее значение, но событие mouseover не работает. Не могли бы вы объяснить мне почему? Я не мог понять, что здесь происходит.

Любые предложения или помощь будут оценены.

P.S: Если я удаляю событие переключения и контролирую значение ссылки внутри вызовов ajax, это не работает вообще.

Кроме того, я собираюсь назначить разные ссылки id на ссылки и обрабатывать их отдельно. Но, я думаю, это неправильный путь.

ответ

1

В нескольких местах у вас есть высказывания вида:

$(this).html(); 

ИЛИ

$(this).html('sometext'); 

Если вы измените их на:

$(this).text(); 

$(this).text('newtext'); 

ли это решить проблему?

ПРИМЕЧАНИЕ: «новый текст» будет представлять собой текст, который вы хотите сохранить в этом теге.

EDIT NOTE2: Я ЗНАЮ, что не ВСЕ ваши проблемы, но, возможно, вы могли бы объяснить вашу желаемую функциональность немного более четко.

Смотрите эту скрипку, чтобы определить, является ли это то, что вы ищете: http://jsfiddle.net/MarkSchultheiss/Swp7x/

Примечание: она использует JSONP и кросс домен и просто использует возвращаемое значение возвращается обратно, но вы можете получить Аякса часть работает по мере необходимости для тебя. Я помещал в поле, чтобы визуально показать значение текущего состояния, чтобы помочь вам понять работу.

+0

ничего не меняет при изменении $ (this) .html(); до $ (this) .text(); – aacanakin

+0

Я добавил функциональность к вопросу. – aacanakin

+0

Это то, чего я хочу, но у меня есть вопрос. также данные, переданные в json или нет? – aacanakin

Смежные вопросы