0

我有以下代码可以使用 Jquery 将新行添加到表中。我可以在尝试小提琴时获得输出,但在使用 Dreamweaver 时无法获得结果。,

有人能告诉我我在哪里被击中吗?查询:

var $ = jQuery.noConflict();
$("#addrows").click(function () {
var newImageDiv = $(document.createElement('div'))
         .attr("id", 'add_div' + imagecounter);


newImageDiv.after().html('<table width="50%" cellpadding="0" cellspacing="0" class="pdzn_tbl1" border="#729111 1px solid">'+
                        '<tr>'+
                        '<td style="padding:5px;" >'+'<input type="text" name="rollno<? $i ?>"  />' + '</td>' + '<td style="padding:5px;">'+ '<input type="text" name="firstname<? $i ?>" />'+'</td>'+'<td style="padding:5px;">'+'<input type="text" name="lastname<? $i ?>" />'+'</td>'+'</tr>'+'</table>');

                        newImageDiv.appendTo("#addgroup");


});

HTML:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<h3> Adding Next Rows </h3>
<div class="common" style="width:1040px; -overflow-x:scroll; padding: 5px 5px 0 5px;" >
<table id="maintable" width="50%" cellpadding="0" cellspacing="0" class="pdzn_tbl1" border="#729111 1px solid"  >
<tr>    <th align="center"> Roll No </th>
        <th align="center"> First Name </th>
        <th align="center"> Last Name </th>
</tr>
<?php
$t_row=3;
for($i=1;$i<=$t_row;$i++) 
        {
        ?>
<tr id="rows">

<div style="padding-left: 5px"> 

<td style="padding:5px;" > <input type="text" name="rollno<? $i ?>"  /> </td>
<td style="padding:5px;"> <input type="text" name="firstname<? $i ?>" /> </td>
<td style="padding:5px;"> <input type="text" name="lastname<? $i ?>" /> </td>
</div>
</tr>

<? } ?>

<div id="add_div1"> </div>
 <table>
<div id="addgroup"> 
</div>
&nbsp; 
<br />
<input type="button" name="add" value="+Add" id="addrows" style="color:#3300FF; font-size:16px; " />
                <input type="hidden" id="hiddenprice" name="hiddenprice" value="3"/> </table>
</div>
</div>

我的 jsfiddle:http: //jsfiddle.net/4KrwY/49/

4

1 回答 1

0

像这样导入 Jquery lib,而且您还缺少脚本关闭标记

  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
    </script>

因为它在 jsfiddle 中工作,如果你复制粘贴它必须工作,或者可能是 Jquery lib 没有加载,

简单的测试试试下面的代码,看看你是否收到这个警报?

<script type="text/javascript" >
  $(document).ready(function(){
           alert("testing"); 
           // your awesome code here 
           // put your  here insdie document ready
         var $ = jQuery.noConflict();
        $("#addrows").click(function () {
          if (document.getElementById("hiddenprice").value == "") {
            imagecounter = 4;
         } else {
           imagecounter = parseFloat(document.getElementById("hiddenprice").value) + 1;
         }

        var newImageDiv = $(document.createElement('div'))
        .attr("id", 'add_div' + imagecounter);
        newImageDiv.after().html('<table width="50%" cellpadding="0" cellspacing="0" class="pdzn_tbl1" border="#729111 1px solid">' +
        '<tr>' +
        '<td style="padding:5px;" >' + '<input type="text" name="rollno<? $i ?>"  />' + '</td>' + '<td style="padding:5px;">' + '<input type="text" name="firstname<? $i ?>" />' + '</td>' + '<td style="padding:5px;">' + '<input type="text" name="lastname<? $i ?>" />' + '</td>' + '</tr>' + '</table>');
       newImageDiv.appendTo("#addgroup");
       document.getElementById("hiddenprice").value = imagecounter;
       imagecounter++;
    });
});
</script>
于 2013-10-01T12:45:29.693 回答