0

わかりましたので、このページでやろうとしていることのこの単純化されたコードがあります。名前を尋ねるページをロードするとすぐに、ブラウザーにプロンプ​​トを表示させたい。彼らが自分の名前に答えると、その変数 (名前) が取得され、id "welcomeText" で div 内に書き込まれます。なんらかの理由で機能しません...助けてください。

これが私のコードです。読みやすくするために、すべてを html インデックス内に配置します。 

<title>Welcome to Validus</title>

<style>
#welcomeText {
         font-family:Verdana;
         font-size:12px;
         color:black;
         width:100px;
         height:100px;
         margin:0px auto;
}
</style>

<script type="text/javascript">

 var name=prompt("Hey! Welcome to Validus! Whats your name?", "Name");

 document.getElementById("welcomeText").innerHTML = "Hey" + " " + name + "! " + "Welcome to validus...";

</script>

</head>
<body>

<div id="welcomeText">
</div>

</body>
4

4 に答える 4

1

スクリプトを末尾の body タグの直前に移動します。そうでない場合、「welcomeText」は参照するページにまだ存在しません。

于 2013-06-18T23:00:50.183 に答える
0

document.createTextNode私のコメントに従って使用する方法を示します。

また、参照window.onloadしてくださいaddEventListener

ノート

load イベントは、ドキュメントの読み込みプロセスの最後に発生します。この時点で、ドキュメント内のすべてのオブジェクトが DOM にあり、すべての画像とサブフレームの読み込みが完了しています。

attachEventaddEventListener は古いバージョンの IE (IE < 9) ではサポートされていないため、代わりに使用する必要があります。

HTML

<div id="welcomeText"></div>

CSS

#welcomeText {
    font-family:Verdana;
    font-size:12px;
    color:black;
    width:100px;
    height:100px;
    margin:0px auto;
}

Javascript

function doWelcome() {
    window.removeEventListener("load", doWelcome);

    var name = prompt("Hey! Welcome to Validus! Whats your name?", "Name");

    document.getElementById("welcomeText").appendChild(document.createTextNode("Hey" + " " + name + "! " + "Welcome to validus..."));
}

window.addEventListener("load", doWelcome, false);

jsfiddleについて

于 2013-06-18T23:17:50.283 に答える
-1

これはjQueryを使用した例です...

キーは$(document).ready(function() {} );、JavaScriptが更新を試みる前にDIVがDOMに存在するように使用しています。

<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
        <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
        <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />

        <style>
            table, tr, td {border:1px solid green;border-collapse:collapse;padding:5px 5px;}
        </style>

        <script type="text/javascript">
            $(document).ready(function() {

                var name=prompt("Hey! Welcome to Validus! Whats your name?", "Name");
                $("#welcomeText").html("Hey" + " " + name + "! " + "Welcome to validus...");


            }); //END $(document).ready()

        </script>
    </head>
<body>

    <div id="welcomeText"></div>

</body>
</html>
于 2013-06-18T23:12:36.197 に答える