Полностью удалить и заменить содержимое Div, используя jQuery - PullRequest
0 голосов
/ 11 апреля 2019

У меня проблема, не могли бы вы, ребята, сказать, как полностью удалить текущее содержимое div и заменить его последним содержимым с помощью jQuery? Я попробовал replaceWith, Empty (), Remove (), Html, ничего из этого не работает.

Вот мой код, который я пытаюсь сделать, это загрузить "js scripts", необходимый для запуска контента в ответе ajax. это работает, как я ожидал, но только для первого набора результатов. Пример: если я нажимаю на кнопку loademore в первый раз, она загружает необходимые сценарии один раз. но если я нажму на него еще раз, он снова начнет загружать js-скрипты без замены текущего. поэтому, когда я нажимаю любую кнопку, она продолжает работать 2 раза.

$("#loadMore").on('click', function(e) {
  e.preventDefault();
  $.ajax({
    method: 'GET',
    url: baseUrl + 'ajaxcontroller/Load_Categories_To_View',
    success: function(data) {
      $('#searchResults').append(data);
      $('#scripts').empty();
      checkloadjscssfile(baseUrl + 'assets/js/comparison/jquery.comparison.js', 'js');
      checkloadjscssfile(baseUrl + 'assets/js/comparison/animatedModal.min.js', 'js');
      checkloadjscssfile(baseUrl + 'assets/js/comparison/comp.js', 'js');
      $('#loadingImage2').hide();
    },
    complete: function() {
      $('#loadingImage2').hide();
      $("#loadMore").show();
    },
    error: function(xhr, ajaxOptions, thrownError) {
      alert(thrownError);
    }
  });
});

function loadjscssfile(filename, filetype) {
  if (filetype == "js") { //if filename is a external JavaScript file
    var fileref = document.createElement('script');
    fileref.setAttribute("type", "text/javascript");
    fileref.setAttribute("src", filename);
    console.log(fileref);
    $('#scriptsLazy').remove();
    $('#scriptsLazy').replaceWith(fileref);
  } else if (filetype == "css") { //if filename is an external CSS file
    var fileref = document.createElement("link");
    fileref.setAttribute("rel", "stylesheet");
    fileref.setAttribute("type", "text/css");
    fileref.setAttribute("href", filename);
  }
  if (typeof fileref != "undefined") {
    document.getElementsByTagName("head")[0].appendChild(fileref);
  }
}

function checkloadjscssfile(filename, filetype) {
  if (filesadded.indexOf("[" + filename + "]") == -1) {
    loadjscssfile(filename, filetype);
    filesadded += "[" + filename + "]"; //List of files added in the form "[filename1],[filename2],etc"
  } else {
    loadjscssfile(filename, filetype);
    //$('#scripts').refresh();
    //alert('unsuc');
  }
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Ответы [ 3 ]

2 голосов
/ 11 апреля 2019

HTML:

<div class="program-wrapper">
    Hello there!
</div>

JQuery:

$('.program-wrapper').text('new string');

Он заменит ваш предыдущий текст новым.

$('.program-wrapper').html('new html');

например: $('.program-wrapper').html('<p> What are you doing? </p>');

Он заменит ваш предыдущий текст новым html.

var ht = $('.program-wrapper').html();
var newHt = ht + '<p>What are you doing?</p>';
$('.program-wrapper').html(newHt);

Это добавит ваш новый html в конце вашего предыдущего html.

var newHt = ht + '<p> What are you doing? </p>';
$('.program-wrapper').append(newHt);

Это также позволит вам добавить новый HTML-код в конец вашего div с именем класса 'program-wrapper'.

1 голос
/ 11 апреля 2019

"Полностью удалить и заменить содержимое Div с помощью jQuery"

Просто удалите html и назначьте снова, чтобы все работало нормально

Надеюсь, что ниже Snaps помогает

(function(){
  var x = true
  setInterval(function(){
    if(x){
      $('#xesloohc').html('')
    }else{
      $('#xesloohc').html('#GOD #XESLOOHC')
    }
    x=!x
  },3000)
})();
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="god">
  <div id="xesloohc">
    #GOD #XESLOOHC
  </div>
</div>
0 голосов
/ 11 апреля 2019

здесь я прикрепил одну ссылку, которая может показать демонстрацию полного удаления текущего содержимого div и заменить его на последнее содержимое с помощью jQuery.

Ссылка для отображения кода и демонстрации этого

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...