ボタンをクリックして行を追加する

入力「プラス」をクリックしたときにこのテーブルの行を追加しようとしています。ボタンをクリックして行を追加する

私が使用している何私のHTML

<table name="mytable2" width="100px" border="0" cellspacing="0" cellpadding="0" style="padding-top:5px"> 
    <tr class="st" name="st"> 
    <td width="80px" style="text-align:center; padding-top:3px;"> 
    <input type="Text" id="newst" name="newst" maxlength="25" style="width:80px; font-family:Tahoma; font-size:11px;"></td> 
    <td width="20px"> 
    <input type="submit" name="plus" id="plus" value="+" style="width:20px; text-align:center;"></td> 
    </tr> 
</table>

：

<script type="text/javascript"> 
$(document).ready(function() { 
    $("#plus").click(function() { 
$('#mytable2 tbody>tr:last').clone(true).insertAfter('#mytable2 tbody>tr:last'); 
$('#mytable2 tbody>tr:last #st').val(''); 
    $('#mytable2 tbody>tr:last #newst').val(''); 
      $('#mytable2 tbody>tr:last #plus').val('+'); 
return false; 
    }); 
});

を誰が助けてもらえますか？

出典

2012-01-26 Brett J Mason

コードを実行しませんでした。何が起こるのですか？ – j08691

ID ...私は多分あなたが数行のコードでそれをやろうとしている、およびフレームワークを使用して縛られてしまったと思う:)

<table name="mytable2" 


<table id="mytable2"

http://jsfiddle.net/brentmn/whgy6/

出典

2012-01-26 22:36:54

うん、良いキャッチ。 –

...ありがとう –

に名前を付けません以下は、あなたが望むことを行い、ライブラリを必要としません。あなたがバイトで転送を心配している場合は、明確なコードを書くと、このような

http://developer.yahoo.com/yui/compressor/

としてminifierここでは私のために働いたものだ、とそれは

<html> 
<head> 
<title>foo</title> 
<script type="text/javascript"> 
function insertAfter(referenceNode, newNode) { 
    referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling); 
} 

function cloneRow(e) { 

    // first find our row 
    var elem = e; 
    while (elem.tagName != 'TR') { 
    elem = elem.parentNode; 
    } 

    var newElem = elem.cloneNode(true); 
    insertAfter(elem, newElem); 
} 
// ]]> 
</script> 
</head> 
<body> 
<table name="mytable2" width="100px" border="0" cellspacing="0" cellpadding="0" style="padding-top:5px"> 
    <tr class="st" name="st"> 
    <td width="80px" style="text-align:center; padding-top:3px;"> 
    <input type="Text" id="newst" name="newst" maxlength="25" style="width:80px; font-family:Tahoma; font-size:11px;"></td> 
    <td width="20px"> 
    <input type="submit" name="plus" id="plus" value="+" style="width:20px; text-align:center;" onclick="cloneRow(this)"></td> 
    </tr> 
</table> 
</body> 
</html>

クレジット:)を起動するように読めるのですとそれを縮小化クレジットが原因であり、私はこの答えの一部を別の答えから挿入トリックを使用していることがわかります...

.insertAfter or .append to an Element Id with Javascript. it's a script tag so it can't be with $

これはhtmlの "this"を渡すことに依存していることに注意してください。 jQueryなどで添付している場合は、eターゲットなどを参照する必要があります。

出典

2012-01-26 23:23:33 Gus

ボタンをクリックして行を追加する

答えて

関連する問題