JQuery 1.7.1中的代码在2.0.2中不起作用

Code in JQuery 1.7.1 not working in 2.0.2

本文关键字:不起作用 JQuery 代码      更新时间:2023-09-26

当点击添加行按钮时,我正试图克隆最后一行,如下所示,此代码在1.7.1 jquery中运行良好,但如果我引用2.0.2,则无法运行

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>

那么它就不起作用了。

我添加了jquery-migrate-1.1.js,但仍然没有用。

请帮助解决。

<html lang="en">
    <head>
        <meta charset="utf-8">
    </head>
    <body>
<table id="advFilterTable" class="table-filter">
                                <tbody>
                                <tr>
                                    <td>
                                        <select id="advFilterColumn1" name="advFilterColumn1" class="chzn-select filter-column" data-placeholder="Select Column"  style="width: 120px;">
<option value=SupportDesciption>Support Desciption</option>
<option value=CostCentre.CostCentreCode>Cost Centre</option>
<option value=AdditionalPropertyValue.value>System Roles</option>
<option value=AdditionalProperty.Key>System Role Type</option>
                                        </select>
                                    </td>
                                    <td>
                                        <select id="advFilterOperand1" name="advFilterOperand1"  class="chzn-select filter-operand" data-placeholder="Select Operand" style="width: 120px;">
 <option value=Equals>Equals</option>
 <option value=GreaterThan>GreaterThan</option>
 <option value=LessThan>LessThan</option>
 <option value=GreaterThanOrEqual>GreaterThanOrEqual</option>
 <option value=LessThanOrEqual>LessThanOrEqual</option>
 <option value=Contains>Contains</option>
 <option value=StartsWith>StartsWith</option>
 <option value=EndsWith>EndsWith</option>
                                        </select>
                                    </td>
                                    <td>
                                        <input id="advFilterText1" name="advFilterText1" class="filter-text" style="height: 17px; margin-bottom: 8px" type="text" value=""></input>
                                    </td>
                                    <td>
                                        <button class="btn delete-filter" id="advFilterbtn1" name="advFilterbtn1" style="margin-bottom: 8px"><i class="icon-minus"></i></button>
                                    </td>
                                </tr>
                                </tbody>
                            </table>  
          <button class="add-filter">Add Row</button>            
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
        <script>
          $(".add-filter").live('click', function(event) {
            // clone the last row in the table
            var $tr = $('.table-filter').find("tbody tr:last").clone();
            // get the name attribute for the input and select fields
            $tr.find("input,select").attr("name", function() {
                // break the field name and it's number into two parts
                var parts = this.id.match(/('D+)('d+)$/);
                if (parts != null) {
                    // create a unique name for the new field by incrementing
                    // the number for the previous field by 1
                    return parts[1] + ++parts[2];
                }
                return rollDice();
                // repeat for id attributes
            }).attr("id", function() {
                var parts = this.id.match(/('D+)('d+)$/);
                if (parts != null) {
                    return parts[1] + ++parts[2];
                } 
                return rollDice();
            });
            $('.table-filter').find("tbody tr:last").after($tr);
        });
        </script>       
        </body>
</html>

扩展Lwyrn的答案,

更改

$(".add-filter").live('click', function(event) {

$(document.body).on('click', '.add-filter', function(event) {

live函数在jquery 1.7中被弃用,在1.9中被完全删除使用.click而不是.live