2

要素を動的に追加するために、次の JQuery コードを試しています。

シナリオ: a) 以下のスクリプトと jquery.min.js を含めると、機能しません。b) 以下のスクリプトを body に追加し、jquery.min.js を追加しても、まだ機能しません。c) 以下のスクリプトを本文に追加し、以下のコードのすぐ上に jquery.min.js を追加すると、機能します。これはなぜですか？

また、jquery.min.js を joomla の他の機能が機能するように頭に入れておく必要があります。頭と体の両方に jquery.min.js を追加しても問題ありませんか。

jQuery v@1.8.1 を使用しています

上記のシナリオを理解するのを手伝ってください。

 <script type="text/javascript">
window.addEvent('domready', function() {
var count = 0;
$('p#add_field').click(function(){
count += 1;
$('#container').append(
'<strong>Link #' + count + '</strong><br />' + '<input id="field_' + count + '" name="fields[]' + '" type="text" /><br />' );
});
});
</script>

以下の部分は、動的に追加されるコードです。

<div id="container">
        <p id="add_field"><a href="#"><span>&raquo; Add your favourite links.....</span></a></p>
    </div>
4

4 に答える 4

3

そのコードは、MooTools に関連するどこかから取得しましたか?

これに巻いてみる

jQuery(document).ready(function() {
  //do stuff
})

参照用のリンク http://davidwalsh.name/javascript-domready

したがって、結果は次のようになります。

<script type="text/javascript">
    $(function() {//shorthand way of doing document.ready
        var count = 0;
        $('p#add_field').click(function(){
            count += 1;
            $('#container').append(
                '<strong>Link #' + count + '</strong><br />' + '<input id="field_' + count + '" name="fields[]' + '" type="text" /><br />' );
        });
    });
</script>
于 2012-09-13T05:57:42.450 に答える
1

実際のスクリプトの前に jQuery の include タグを追加すると機能する理由scriptは、スクリプトが jQuery を使用して実行するためです。JavaScript では、ロードされた順序でスクリプトの機能にアクセスできます。

于 2012-09-13T06:00:39.020 に答える
0

以下を試してください：

$document =& JFactory::getDocument();
$document->addScript("jquery-1.8.1.min.js");
$js = " $(document).ready(function() {
    var count = 0;
    $('p#add_field').click(function(){
      count += 1;
      $('#container').append('<strong>Link #' + count + '</strong><br />' + '<input id="field_' + count + '" name="fields[]' + '" type="text" /><br />' );
    });
});";
$document->addScriptDeclaration($js);
于 2012-09-13T12:58:10.690 に答える
0

あなたの文書で：

<head>
    <script type="text/javascript" src="jquery-1.7.2.min.js"></script>
    <script>
        var count = 0;
        $(document).ready(function() {
            $('p#add_field').click(function(){
                count += 1;
                $('#container').append('<strong>Link #' + count + '</strong><br />' + '<input id="field_' + count + '" name="fields[]' + '" type="text" /><br />' );
            });
        });
    </script>
</head>
于 2012-09-13T05:58:39.680 に答える