jQuery на страницах Media Wiki (не только в Monobook.js или расширениях) - PullRequest
2 голосов
/ 29 марта 2011

Я пытаюсь сделать некоторые простые вещи jQuery «динамически» на странице контента MediaWiki.На самом деле это просто для «улучшения» некоторых различных функций.

Я сделал следующее: http://www.mediawiki.org/wiki/JQuery http://www.mediawiki.org/wiki/Manual:$wgRawHtml (в основном для кнопок PayPal изначально)

Код ниже не работает.Это помещается на пустой странице содержимого.

<html>
<script>
$j(document).ready(function(){
    $j('#test').hover(
        function(){
            $j('#test').attr('background-color','red');
        }, 
        function(){ 
            $j('#test').removeAttr('background-color');
        }
    );
});
</script>
<div id="test">Howdy</div>
</html>

Ничего не происходит ...

Есть идеи?

Обновление:

Я пытался это простое решение безрезультатно.

example.com / wiki / index.php? Title = MediaWiki: Common.js

$j('#jTest-Howdy').hover(
        function(){
            $j('#jTest-Howdy').addClass('jTest-red');
        }, 
        function(){ 
            $j('#jTest-Howdy').removeClass('jTest-red');
        }
);


example.com/wiki/index.php?title=MediaWiki:Common.css

.jTest-red { background-color: red; }


example.com/wiki/index.php?title=jQueryTest

<html>
<div id="jTest-Howdy">Howdy</div>
</html>

как выможно увидеть здесь, этот код должен работать, если jQuery загружался правильно ... http://jsfiddle.net/5qFhv/

, но он не работает для меня ... любая помощь?

Ответы [ 3 ]

2 голосов
/ 29 марта 2011

Если вы используете jQuery, загруженный MediaWiki 1.17, имейте в виду, что большинство JavaScript загружается после содержимого страницы. Встроенный элемент выполняется сразу же после его достижения, поэтому $ j не будет определен в настоящее время - вы, вероятно, увидите некоторые ошибки в консоли ошибок JavaScript на этот счет.

(Я не уверен насчет jQuery, который включен в 1.16; до этого, насколько я знаю, версии MediaWiki не включали jQuery.)

Как правило, здесь вам нужно либо поместить модули кода JavaScript на страницу «MediaWiki: Common.js» и позволить им подключиться к вашей HTML-разметке, либо создать расширение MediaWiki, которое затем можно вызывать из ваши страницы, и которые позволят вам создать любой интересный вывод HTML и JavaScript вам нравится.

Код, который вы вставили на страницу MediaWiki: Common.js, будет загружен после инициализации другого пользовательского интерфейса, обеспечивая наличие кода и переменных, чтобы вы могли обращаться к jQuery и т. Д.

1 голос
/ 02 апреля 2011

Я не знаю много о MediaWiki, но для меня это выглядит как простые ошибки в JavaScript.

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

$j('#test').css('background-color', 'red');

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

$j.('#test').live('mouseover', function(){
  $j(this).addClass('hover-class');
}).live('mouseout', function(){
  $j(this).removeClass('hover-class');
});

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

1 голос
/ 01 апреля 2011

Попробуйте поместить весь свой пользовательский код jQuery в его собственный файл, затем загрузите его как модуль с ResourceLoader после jQuery.

http://www.mediawiki.org/wiki/ResourceLoader/Migration_guide_for_extension_developers

Кроме того, в качестве метода отладки: полностьюзагрузите свой сайт в Firefox, затем введите свой собственный код jQuery в консоли.Если это работает, ваша проблема в состоянии гонки.Если это не так, jQuery по какой-то причине не загружается.

...