Доступ к объектам jQuery в шаблоне модуля

Действительно попав в javascript и оглядываясь по некоторым шаблонам. Один из них, который я получил, - это шаблон модуля. Кажется, это хороший способ подумать о функциях патронов, поэтому я пошел вперед и попытался реализовать его с помощью jQuery. Тем не менее, я наткнулся на уловку. Рассмотрим следующий код:Доступ к объектам jQuery в шаблоне модуля

<!DOCTYPE html> 
<html> 
    <head> 
     <meta http-equiv="Content-type" content="text/html; charset=utf-8"> 
     <title>index</title>   
     <script type="text/javascript" charset="utf-8" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 
     <script type="text/javascript" charset="utf-8"> 
      $(document).ready(function(){ 

       var TestClass2 = (function(){ 
        var someDiv;    
        return { 
         thisTest: function() 
         { 
           someDiv = document.createElement("div"); 
            $(someDiv).append("#index"); 
            $(someDiv).html("hello"); 
            $(someDiv).addClass("test_class"); 
         } 
        } 
       })(); 

       TestClass2.thisTest();   

      }); 
     </script> 

    </head> 

    <body id="index" onload=""> 

     <div id="name"> 
      this is content 
     </div> 

    </body> 
</html>

Приведенный выше код предупреждает о содержании html в div и затем добавляет класс. Они используют методы jQuery. Проблема в том, что метод .html() работает отлично, но я не могу добавить класс. Никаких ошибок не возникает, и класс не добавляется. Что здесь происходит? Почему класс не добавляется в div?

источник

2011-01-16 Stewart

Работы для меня ... – lonesomeday

Откуда вы знаете, что класс не добавлен? Вы дали ему визуальный стиль? Если вы тестируете результат, посмотрев «Просмотр источника» в своем браузере, вы не увидите результат. Вам нужно будет использовать инструменты разработчика, которые показывают обновления DOM. – user113716

С каким браузером (-ами) и какой платформой (-ами) это происходит? –

А теперь, когда вы обновили свой вопрос, я могу лучше ответить на ваш вопрос. Вы должны изменить append на appendTo, считая, что хотите переместить вновь созданный элемент внутри уже существующего #index.

$(document).ready(function() { 

var TestClass2 = (function() { 
    var someDiv = $("#name"); 
    return { 
     thisTest: function() { 
      someDiv = document.createElement("div"); 
      $(someDiv) 
       .html("hello") 
       .addClass("test_class") 
       .appendTo("#index"); 
     } 
    } 
})(); 

TestClass2.thisTest(); 

});

Надеюсь, это поможет!

источник

2011-01-17 00:52:10 Lance

Это так. Спасибо за помощь Лэнс! – Stewart

Я скопировал и вставил ваш код, и он работает для меня.

Убедитесь, что вы не просто просматриваете источник, чтобы узнать, применяется ли класс, потому что это просто показывает вам HTML-код, отправленный с сервера - любые обновления DOM, которые происходят через JavaScript, не будут отображаться.

Для просмотра живого DOM используйте инструмент, например Firebug или инспектор WebKit (входит в состав Safari и Chrome).

источник

2011-01-16 23:36:41

Вы не используете firefox самостоятельно, случайно? – Stewart

PS: Я использую инструмент для chrome и Firefox. Код работает в firefox, но не в хроме. :( – Stewart

Ваш код отлично работает! http://jsfiddle.net/lmcculley/p3fDX/

источник

2011-01-16 23:55:22 Lance

Извините, код, который я написал, не лучший пример. Http://jsfiddle.net/p3fDX/2/ действительно моя проблема. – Stewart

http://jsfiddle.net/lmcculley/p3fDX/5/ Я нашел ваш выпустил и исправил его. – Lance

Доступ к объектам jQuery в шаблоне модуля

ответ

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