0

jQuery を使用して見出しの 1 つのテキストを変更しようとしていますが、見出しが空白のままになります。どうすればこれを機能させることができますか？

編集：

見出しのある html ページ:

<!-- Logs -->
    <div data-role="page" data-theme="a" id="page15">
        <div data-theme="a" data-role="header">
            <h3>
                Logs
            </h3>
            <a data-role="button" data-direction="reverse" data-transition="slide" href="#page3" data-icon="arrow-l" data-iconpos="left" class="ui-btn-left">
                Back
            </a>
        </div>
        <div data-role="content" style="padding: 15px">
            <a data-role="button" data-transition="slide" href="#page1">
                Add log entry
            </a>
            <div data-role="collapsible-set" data-theme="" data-content-theme="">
                <div data-role="collapsible" data-collapsed="true">
                    <h3>
                        July 2012
                    </h3>
                    <div data-role="collapsible-set" data-theme="" data-content-theme="">
                        <div data-role="collapsible" data-collapsed="true" onclick="getLogTime(); this.onclick=null">
                            <h3>
                                July 5
                            </h3>
                            <div data-role="collapsible-set" data-theme="" data-content-theme="">
                                <div data-role="collapsible" data-collapsed="true" onclick="getLogData(); this.onclick=null">
                                    //Heading I'm trying to change
                                    <h3 id=time1>
                                    </h3>
                                    <div>
                                        <p id="logFortime1">
                                        </p>
                                    </div>
                                </div>
                                <div data-role="collapsible" data-collapsed="true">
                                    <h3>
                                        12:47 pm
                                    </h3>
                                </div>
                            </div>
                        </div>
                        <div data-role="collapsible" data-collapsed="true">
                            <h3>
                                July 6
                            </h3>
                        </div>
                    </div>
                </div>
                <div data-role="collapsible" data-collapsed="true">
                    <h3>
                        August 2012
                    </h3>
                </div>
            </div>
            <a data-role="button" data-transition="slide" href="#page21">
                Graphs
            </a>
        </div>
    </div>

見出しを変更するはずの関数:

function getLogTime() {
$('#time1').text('Time')
}

編集：

= を追加したため、ヘッダーのテキストは変更されますが、スタイルと折りたたみ可能なメニューの内容はすべて失われます。

4

2 に答える 2

1

タグ名または ID を使用する必要があります (推奨)。複数のセレクターを結合しないでください (特に、DOM 内に常に複数の ID を持つべきではないため)。html() メソッドは text() メソッド ( http://jsperf.com/jq2-text-vs-htmlを参照) よりもはるかに高速ですが、意味的には text() の方が適切です。(DOM の) コードを実行する前に、DOM がロードされていることを確認してください。以下は最速であり、動作するはずです。

$(function(){
  $("#time1").html("Time");
});
于 2012-07-31T19:13:27.107 に答える
0

純粋な jQuery ソリューションを使用してみませんか? クリック可能な要素に onclick 属性を指定する代わりに、この方法で jQuery を使用できます。

HTML :

<h3 id="time1">Deepak</h3>
<a id='changeheading'>click</a>

JavaScript/jQuery :

$(document).ready(function(){
$('#changeheading').on("click",function(){    
$('#time1').text('Time');
});
});​

そして、それは非常にうまく機能します。ここでデモを確認してくださいhttp://jsfiddle.net/DeepakKamat/b9ggb/25/

于 2012-11-08T07:25:36.437 に答える