1

私はプログラミングに不慣れで、ボタンやクリックイベントなしで関数を呼び出そうとしています。私はjavascript関数を使用してテーブル内でテーブルをやっています。これまでの私のコードは次のとおりです。

<html>
<head> <title> Hello </title> </head>
<body>
<table border=1>
    <tr>
        <td> Hello! <input type='hidden' value='0' id='theValue' /> <script> add(); </script> <div id='myDiv'> </div> </td>
    </tr>

<script>
$ctra = 1;
$ctr1a = 1;  
function add() { 
    var ni = document.getElementById('myDiv');
    var numi = document.getElementById('theValue');
    var num = (document.getElementById('theValue').value -1)+ 2;
    numi.value = num;
    var newdiv = document.createElement('div');
    var divIdName = 'my'+num+'Div';
    newdiv.setAttribute('id',divIdName);
    newdiv.innerHTML = "<table border=1>"+
                        "<tr>"+
                        "<td> Hello! <input type='hidden' value='0' id='theValue' /> <script> add(); </script> <div id=('" + divIdName + "')> </div> </td>"+
                        "</tr>"+
                        "</table>";
    if($ctra<100){
        ni.appendChild(newdiv);
        $ctra++;
    }
}
</script>

</table>
</body>
</html>


実行すると表示されます

"+ ""+ "
Hello!
"; if($ctra<100){ ni.appendChild(newdiv); $ctra++; } }


ブラウザで。問題は何でしょうか？前もって感謝します！

編集

function add() { 
    var ni = document.getElementById('myDiv');
    var numi = document.getElementById('theValue');
    var num = (document.getElementById('theValue').value -1)+ 2;
    numi.value = num;
    var newdiv = document.createElement('div');
    var divIdName = 'my'+num+'Div';
    newdiv.setAttribute('id',divIdName);
    newdiv.innerHTML = "<table border=1><tr><td> Hello! <input type='hidden' value=0 id='theValue' /><div id='" + divIdName + "'></td></tr></table>";
    ni.appendChild(newdiv);
    for(var i=1;i<100;i++) {
        var ni = document.getElementById(divIdName);
        var numi = document.getElementById('theValue');
        var num = (document.getElementById('theValue').value -1)+ 2;
        numi.value = num;
        var newdiv = document.createElement('div');
        var divIdName = 'my'+num+'Div';
        newdiv.setAttribute('id',divIdName);
        newdiv.innerHTML = "<table border=1><tr><td> Hello! <input type='hidden' value='" + i + "' id='theValue' /><div id='" + divIdName + "'></td></tr></table>";
        ni.appendChild(newdiv);
    }
}
4

6 に答える 6

3

これを試して

<html>
<head> <title> Hello </title> </head>
<script type="text/javascript">

    $ctra = 1;
    $ctr1a = 1;
    function add() { 
    alert('s')
    var ni = document.getElementById('myDiv');
    var numi = document.getElementById('theValue');
    var num = (document.getElementById('theValue').value -1)+ 2;
    numi.value = num;
    var newdiv = document.createElement('div');
    var divIdName = 'my'+num+'Div';
    newdiv.setAttribute('id',divIdName);
    newdiv.innerHTML = "<table border=1><tr><td> Hello! <input type='hidden' value='0' id='theValue' /></tr></table>";
    if($ctra<100){
        ni.appendChild(newdiv);
        $ctra++;
    }
}

</script>

<body onload="add()">
<table border="1">
    <tr>
        <td> Hello! <input type='hidden' value='0' id='theValue' />

        <div id='myDiv'> </div> </td>
    </tr>
</table>
</body>
</html>

それがあなたのために働くことを願っています.. :)

于 2013-03-01T14:20:01.540 に答える
2

JS はネストされたブロックになります。これは html では許可されていません。ブロック内の関数 add() は定義されていません。これは、ブラウザーがそれに遭遇したときに、add() の定義がまだ表示されていないためです。テーブルには、さらに別のスクリプトを含む別のテーブルを含むスクリプトが含まれています。とても紛らわしいです:P

OK、私が正しく理解していれば、テーブルは 1 つです。JS に別のテーブルを入れてもらいたいとします。中に入れたいものは、この例ではテーブルのコピーです。テーブル内にテーブルを作成し、プログラムでそれを実現したいと考えています。

最初に問題を分離します: スクリプトと html: 定義の後に add() を配置し、本文の後にスクリプトを配置すると、ブラウザーはそれを検出して実行します。HTH:

<html>
<head> <title> Hello </title> </head>
<body>
    <table id="t1" border=1>
        <tr>
            <td> Hello! <input type='hidden' value='0' id='theValue' />
                <div id='myDiv'></div>
            </td>
        </tr>
    </table>

<script>
    function add_table() {
        var table1 = document.getElementById("t1"),
            table2 = table1.cloneNode(true),
            mydiv = document.getElementById("myDiv"),
            mydiv2;

        table2.setAttribute('id', 't2');
        mydiv2 = table2.getElementsByTagName("div")[0];
        mydiv2.setAttribute('id', 'myDiv2');
        mydiv.appendChild(table2);
    }
    // call the function
    add_table();

</script>
</body>
</html>
于 2013-03-01T15:33:44.247 に答える
0
  1. スクリプトをテーブル要素の外に移動して、先頭または本文の末尾に移動します。
  2. 最初に div を追加してから、スクリプトを呼び出します。あなたはあなたに電話したいかもしれませadd()ん<body onload='add'>
  3. ここの中かっこを削除して、有効な html を作成します。<div id=('" + divIdName + "')>
于 2013-03-01T14:19:34.780 に答える
0

コードの中にあります</script>。ブラウザはそれを javascript の終わりと解釈し、HTML に戻ります。これを修正するには、この文字列をたとえば</sc'+'ript>. これでこの問題は修正されますが、おそらくまだスクリプトに少し手を加える必要がありますが、それは別の話です。

于 2013-03-01T14:15:34.103 に答える
0

次のように、異なる引用符を切り替えて、id の中かっこを削除する必要があります。

newdiv.innerHTML = "<table border=1>"
    +"<tr>"
    +'<td> Hello! <input type="hidden" value="0" id="theValue" /> '
    +'<script> add(); </script> <div id="' + divIdName + '"> </div> </td>'
    +"</tr>"
    +"</table>";
于 2013-03-01T14:15:40.197 に答える
0

DOMにイベントがないと関数にアクセスできないため..要素のイベントで関数を呼び出す必要があります。

于 2013-03-01T14:16:27.950 に答える