1

私はファンキーな問題を抱えています。

これが私のコードです。getJSON() を実行して、DB からプルする PHP から情報をフェッチし、その結果を div に入力します。jScrollPane と jEditable があるので、ユーザーは下にスクロールしてクリックしてコンテンツを編集できます。時々動作し、その後動作しないので、ブラウザがコードを適切に解釈していないのか、それとも基本的なDOMの概念を誤解しているのか疑問に思います....

$().ready(function() {
    $('#pane1').jScrollPane();
    $('#tab_journal').tabs();

    $('#tab2').load("/journal_new.php");

    var i=0;
    var row = '';
    var k, v, dt;

    $.getJSON("/ajax.php?j=22", function(data) {
        row = '<p>';
        while(i<data.length) {
            $.each(data[i], function(k, v) {
                if (k == 'subject') {
                    row += '<div style="font-size:1.5em; color:#000000;"><div class="editable" style="width:705px;" id="title-'+data[i].id+'">'+v+'</div></div>posted: '+dt+'<br />';
                } else if (k == 'dt') {
                    dt = v;
                } else if (k == 'msg') {
                    row += '<div class="editableMsg" style="width:705px; height:40px;" id="msg-'+data[i].id+'">'+v+'</div></p>';
                }
            });
            i++;
        }
        $('#pane1').append(row).jScrollPane({scrollbarWidth:10, scrollbarMargin:10, showArrows:true});
    });

    $('.editable').livequery(function () {
        $('.editable').editable("/savejournal.php", {
            submitdata : function() {
            },
            tooltip   : 'Click to edit',
            indicator : '<img src="/UI/images/indicator.gif">',
            cancel    : 'Cancel',
            submit    : 'OK'
        });
        $('.editableMsg').editable("/savejournal.php", {
            submitdata : function() {
            },
            tooltip: 'Click to edit',
            indicator : '<img src="/UI/images/indicator.gif">',
            cancel    : 'Cancel',
            submit    : 'OK',
            type      : 'textarea'
        });
        $(".editable,.editableMsg").mouseover(function() { $(this).css('background-color', '#FDD017'); });
        $(".editable,.editableMsg").mouseout(function() { $(this).css('background-color', '#fff'); });
    });
});

そしてHTML：

<div id="tab_container" style="margin:0px 0px 2px 8px;">
    <ul id="tab_journal">
        <li><a href="#tab1"><span>View / Edit</span></a></li>
        <li><a href="#tab2"><span>New Entry</span></a></li>
    </ul>
</div>
<div id="tab1" style="margin:0px 0px 0px 8px;">
    <div id="pane1" class="scroll-pane super-wide"></div>
</div>
<div id="tab2" style="margin:0px 0px 0px 8px; width:700px;"></div>

ありがとう世界。

4

1 に答える 1

0

壊すことができませんでした。コードの行は次のようです。

$('#tab2').load("/journal_new.php");

ブラウザを幸せにしませんでした。

于 2010-04-28T22:47:23.750 に答える