2013-09-21 4 views
0

Так у меня есть веб-сайт, я работаю на так же, как личный веб-сайт, который использует JQuery и JQuery UIJQuery .load() работает только в первый раз

Раньше я использовал скрытый HTML-код и только с помощью JQuery чтобы показать это. Но это делает мой html-файл грязным, поэтому я хотел использовать jQuery .load() для того же, но из внешнего файла.

Прямо сейчас, его значение установлено на .click.

Для моего скрытого html он показывает его каждый раз, когда я нажимаю на определенный элемент. Когда вы нажимаете на другой элемент, он. Он скрывает первый. Я делаю это, имея div с 2 классами. Проблема в том, что когда я пытался загрузить html в скрытый div, а затем показать его и скрыть, он работал только в первый раз.

Достаточно говорить, вот мой код. # 1 работает, # 2 работает только при первом нажатии. И оставляет imagearea пустой каждый раз после.

$(".jquery").click(function(){ 

    clearImageArea(); 
    hideThumbnails(5); 
    showThumbnails(); 
    $("#1").click(function(){ 

     $(".imagearea").html(js); 
     $(".jscode").show(1000); 
     $(".title").text("Extending jQuery"); 
    }); 
    $("#2").click(function(){ 
      $(".jquery2").empty(); 
      $(".jquery2").load("jqueryEx.html"); 


      var jquery2 = $(".jquery2"); 
      $(".imagearea").html(jquery2); 
      $(".jquery2").show(1000); 
      $(".title").text("Extending Jquery Example"); 
     }); 


    }); 

теперь мой скрытый материал в моем HTML файл

Первый мой HTML и JS код загружается в здесь из jqueryEx.html и прячась в другом месте в моей JavaScript с помощью $(".hidden").hide(); и загружены затем в в imagearea через .html() и показано с помощью .show()

 <div class="jquery2 hidden"> 

     </div> 

Моего другого DIV выглядит следующим образом, который помещается в imagearea, нажав на # 1

<div class="jscode hidden"> 
     <div class="block"> 

// много JS кода уклонился в HTML

 </div> <!-- end of block-->  
    </div> 

в другом месте в моем JS кода в начале у меня есть var js=$(".jscode");, чтобы загрузить его в переменную JS вы видели ранее.

, если вы хотите увидеть устаревший пример того, что я работаю на перейти к www.3realsoft.com (только сСту и Js работы по развитию навыков)

, если вы хотите увидеть, какие дополнительные части мой код, просто спросите. Однако большинство из них есть на моем веб-сайте.

+2

'.load()' использует AJAX, который является асинхронным. Все, что зависит от загружаемых элементов DOM, должно выполняться в функции обратного вызова. – Barmar

ответ

0

я попал в этот пункт в результатах поиска, когда я пытался иметь кнопку как загрузить и обновить содержимое, и нагрузка работает, но обновление не работает.

Вот короткая версия решения, Настройка Кэша на ложь была ключом. Решение найдено по этой другой ссылке, но я публикую эту концепцию здесь, потому что, если google упал мне в этом элементе, другие, ищущие то же самое, также, вероятно, окажутся здесь. Реквизит Джону Милликин, убедитесь, что идти к своему ответу и upvote его:Stop jQuery .load response from being cached

<script type="text/javascript"> 
    $(document).ready(function() { 

     $.ajaxSetup({ 
      // Disable caching of AJAX responses 
      cache: false 
     }); 

     $('.detail-expand').click(function() { 

      var detailRowElement = $(this).closest('.session-row-tr').next(); 
      var detailElement = detailRowElement.find('.detail-row-div'); 
      var sessionId = detailElement.data("sessionId"); 

      detailElement.empty(); 
      detailElement.load('/Admin/WebLogPartial/' + sessionId, function() { 
       $.bootstrapSortable(true, 'reversed'); 
      }); 

      detailRowElement.show(); 
     }); 

    }); 
</script> 
0

Все, что зависит от загружаемого HTML, должно выполняться в функции обратного вызова, поскольку первый A в AJAX обозначает асинхронный.

$("#2").click(function(){ 
    $(".jquery2").empty(); 
    $(".jquery2").load("jqueryEx.html", function() { 
     var jquery2 = $(".jquery2"); 
     $(".imagearea").html(jquery2); 
     $(".jquery2").show(1000); 
     $(".title").text("Extending Jquery Example"); 
    }); 
}); 

Я не совсем уверен, что вы пытаетесь сделать с .html(jquery2), так как аргумент .html() должен быть строкой, а не объект JQuery. Возможно, вы имели в виду:

var jquery2 = $(".jquery2").html(); 
+0

Это выглядит хорошо, я проверю его. Еще раз спасибо. –

+0

Ну, это делает более чистую работу по загрузке. Но как только imagearea заполняется чем-то другим, он никогда не работает снова, если нажать # 2. –

+0

с использованием var jquery2 = $ (". Jquery2"). Html(); загружает текст 2 раза. один раз в imagearea, и он пропускает .show(), второй в левом верхнем углу (а не в образной области) с правильной работой .show() –

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