Блог

Как я могу загрузить содержимое div из внешнего файла, но при этом использовать оператор case в процессе? Может быть что-то с моим кодом Jquery? На самом деле.. Я в замешательстве??

Код jQuery:

 $('.click-test').click(function() {
switch (this.id) {
case "test":
$('#test').load('external-file.html #test');
  break;

  case "test2":
  etc..
  });
  

html-страница:

 <div class="click-test" id="test">click test</div>
<div id="test">place words from external file here</div>
  

внешний файл .html

 <div id="test">some words</div>
  

Код jquery в основном правильный. «This» действительно ссылается на HTML-элемент, как вы и подозревали, и установлен. Итак, ваш коммутатор работает.

 <div class="click-test" id="test">click test</div>
  

Однако у вас есть 2 div на вашей базовой HTML-странице, которые оба имеют идентификатор «test». Каждый идентификатор должен быть уникальным на HTML-странице (включая загружаемый вами контент). Итак, вам нужно будет провести небольшой рефакторинг.

Вы могли бы, например, изменить HTML на:

 <div class="click-test" data-loadid="test">click test</div>
  

И JavaScript для:

 $('.click-test').click(function() {
    switch($(this).attr("data-loadid")) {
  

Это привело бы к чтению из атрибута с именем ‘data-loadid’ с использованием функции атрибута jQuery. Затем вы можете перейти к загрузке внешнего содержимого div с помощью load, как вы уже делали. (Хотя, возможно, вы захотите удалить закладку за ненадобностью?)

The this.id ни на что не ссылается, поскольку объектом this является .click-test div, у которого нет атрибута ID. Все остальное выглядит нормально, за исключением того, что я не знаю, должен ли быть пробел после вашего .html #test