2016-05-20 7 views
-1

私は音楽オーディションに登録するためのウェブサイトを作成しようとしているプロジェクトに取り組んでいます。その一部には、一度クリックすると、それぞれに割り当てられた時間のあるボタンを表示するオーディションの日が表示されたボタンが表示されます。これらのボタンをクリックすると、機能が変更され、何も送信されません。JavaScript関数からHTMLボタンを作成するにはどうすればよいですか?

これは実現可能なコンセプトですか?もしそうなら、私はこれをどのように実行するのですか?このような

+1

HTMLやJavaScriptに関する入門チュートリアルがいくつか用意されています。はい、物事を行うボタンがあることは実現可能なコンセプトです。 – David

+0

もう少し詳しく説明してもらえますか? – Pepedou

+0

document.createElement( 'button');しかしチュートリアルは本当に始めるのに最適な場所でなければなりません。 – Shilly

答えて

0

何か:

var btn = document.createElement('button'); 

または:

var btn = document.createElement('input'); 
btn.type = 'button'; 
0

Look into the document.createElement() function in Javascript。使用例は以下のようになり:

<html> 
<head></head> 
<body> 
    <div id="div1"></div> 

    <script> 
    function createButton(id, text) { 
     var b = document.createElement("input"); 
     b.type = "button"; 
     b.id = id; 
     b.value = text; 
     b.onclick += button_click; //assigns the button_click function to the click event of the button. 
     var div1 = document.getElementById("div1"); 
     div1.appendChild(b); //add the button to the page in the div 
    } 

    function button_click(e) { 
     e = window.event ? window.event : e; 
     var b = e.target; 
     b.disabled = true; 
    } 

    createButton("button1", "Click Me"); 
    </script> 
</body> 
</html> 

この実施例はまた、event objectを使用し、要素のdisabled性質、ならびにdocument.getElementById() function

createButton()関数の例は他の関数から呼び出すことができますが、この場合は常にdivという新しいボタンが追加されます。

ここでは、e.targetのボタンをクリックすると、イベントの対象となるボタンが表示されます。 e = window.event ? window.event : e;行は、JavaScriptイベントオブジェクトが確実に取得されたことを確認するためのクロスブラウザの方法です。

この例では、特定の問題は解決しない可能性がありますが、これがHTML/JavaScriptで可能かどうかという疑問に答えることができます。

関連する問題