1

こんにちは、JS で定義された var 文字列を使用して、html5 ボディのコンテンツの一部を動的に設定しようとしています。

以下は私がこれまでに書いたもので、指定された値が表示されていないようです。

<link href="src/jquery.mobile-1.0.min.css" rel="stylesheet" type="text/css"/>
<script src="src/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="src/jquery.mobile-1.0.min.js" type="text/javascript"></script>
<body> 

<script>
    var name = "John Smith";
</script>

<div data-role="page" id="page">
    <div data-role="header">
    <button></button>
        <h1>New Claim</h1>
    </div>
    <div data-role="content">   
        <ul data-role="listview">
    <li> <p><h3>Your Name: <var>name</var></h3></p></li>

        </ul>       
    </div>
    <div data-role="footer">
        <h4>Page Footer</h4>
    </div>
</div>


</body>

「あなたの名前:」テキスト内にジョン・スミスを挿入しようとしています。

ありがとう

4

5 に答える 5

3

変数の内容を HTML ソースに「出力」するには、JavaScript を使用する必要があります。次に例を示します。

<div id="test"></div>
document.getElementById('test').innerHTML = 'This goes into the element!';

ただし、jQuery を使用しているため、次のようにすることもできます。

$('#test').text('This goes into the element!');
于 2013-07-08T13:37:00.490 に答える
2

あなたはおそらく以下のようなものが欲しいでしょう。グローバル JS 変数を割り当て、VAR html5 タグでそれらを参照し、ボディの最後 (または DOM ロード後) で JS を使用して、VAR タグのキーをグローバル VARS オブジェクトに保持されている値に置き換えます。

<script>
    VARS = {};
    VARS.name = "John Smith";
    VARS.age = 45;
</script>
...
Name : <var>name</var><br/>
Age : <var>age</var>
...
<script>
    // run once at end of body
    var all = document.getElementsByTagName("var");
    for(var i=0; i<all.length; i++) {
        var elm = all[i];
        var key = elm.innerHTML;
        if(VARS[key] != null)
            elm.innerHTML = VARS[key];
        else
            elm.innerHTML = "";
    }
</script>
于 2013-07-08T13:47:37.880 に答える
1

タグはこのように使用することは想定されていません。これを試してください:

<link href="src/jquery.mobile-1.0.min.css" rel="stylesheet" type="text/css"/>
<script src="src/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="src/jquery.mobile-1.0.min.js" type="text/javascript"></script>
<body> 

<script>
    var name = "John Smith";

    $(document).ready(function() {
  $("#name").text(name);
});

</script>


<div data-role="page" id="page">
    <div data-role="header">
    <button></button>
        <h1>New Claim</h1>
    </div>
    <div data-role="content">   
        <ul data-role="listview">
    <li> <p><h3>Your Name: <span id="name"></span></h3></p></li>

        </ul>       
    </div>
    <div data-role="footer">
        <h4>Page Footer</h4>
    </div>
</div>
</body>

編集：1つのことを明確にするために。タグは、変数の値の場所を保持するために使用されることは想定されていません。ページにコードを表示している場合、正しいセマンティックな意味は、数学変数またはプログラミング変数を表すことです。ここで私が間違っている場合は、誰かが私を訂正してください。

于 2013-07-08T13:57:09.183 に答える
0

これを試して

$(document).ready(function() {
  $("h3").text("Your name : John Smith");
});

適切なタグを簡単に選択できるように、div にいくつかのクラスを追加します。

于 2013-07-08T13:37:22.590 に答える