0

JavaScriptでは、次のコードがあります $(document).ready(function() {

            var someObj = [];
            $("#submit").click(function() {
                $("input:checkbox").each(function() {
                    if ($(this).is(":checked")) {
                        someObj.push($(this).attr("name"));
                    }
                    console.log(someObj);
                })
            });
            $("#selectAll").click(function() {
                $("input:checkbox").attr('checked', this.checked);
            }
            );
            $("#btn1").on("click", function() {
alert("refresh clicked");
});
            var oTable = $('#example').dataTable({
                "sDom": '<"top"<"#refresh">ip>rt<"clear">',
                "bLengthChange": true,
                "bPaginate"
                        : true,
                "bFilter"
                        : true,
                "aoColumnDefs": [
                    {"bSortable": false, "aTargets": [0]}
                ],
                /*"aoColumns": [
                    {type:"hidden"},
                    {type: "select", values: ['All', 'Red Cross', 'Save The Bay']},
                    {type: "select", values: ['All', 'Humanitarian', 'Educational', 'Environmental']},
                    null,
                    null,
                    null,
                    {type: "select", values: ['All', 'Approved', 'Pending', 'Rejected']}
                ],*/    
                "bInfo"
                        : true,
                "bAutoWidth"
                        : true}).
                    columnFilter();
            $("#refresh").html('<input type="button" value="reject" id="btn1" />');
            function fnCreateSelect(aData)
            {
                var r = '<select><option value=""></option>', i, iLen = aData.length;
                for (i = 0; i < iLen; i++)
                {
                    r += '<option value="' + aData[i] + '">' + aData[i] + '</option>';
                }
                return r + '</select>';
            }
            new FixedHeader(oTable, {"top": true});
        });
</script>

htmlには次のコードがあります。

  <table  id="example"  class="display">
        <thead>
        <th><input type="checkbox" id="selectAll"></th>
        <th>Organization Name</th>
        <th>Type Of Event</th>
        <th>Date Range</th>
        <th>Location</th>
        <th>No of Hours</th>
        <th>Status</th>
        <th>Actions</th>
    </thead>
    <tfoot>
        <tr>
            <th></th>
            <th>Organization Name</th>
            <th>Type Of Event</th>
            <th></th>
            <th></th>
            <th></th>
            <th>Status</th>
            <th></th>
        </tr>
    </tfoot>
    <tbody>

        <tr class="odd_gradeX" id="2">
            <td><input type="checkbox" value="1" name="check1"></td>
            <td class="read_only">Save The Bay</td>
            <td>Educational</td>
            <td>2012-09-01</td>
            <td class="center">Abc</td>
            <td class="center">23</td>
            <td>Approved</td>
            <td>action</td>
        </tr>
        <tr class="even_gradeC" id="4">
            <td><input type="checkbox" value="2" name="check2"></td>
            <td>Red Cross</td>
            <td>Educational</td>
            <td>2012-09-01</td>
            <td class="center">Abc</td>
            <td class="center">23</td>
            <td>Approved</td>
            <td>action</td>
        </tr>
        <tr class="odd_gradeX" id="2">
            <td><input type="checkbox" value="3" name="check3"></td>
            <td class="read_only">Save The Bay</td>
            <td>Educational</td>
            <td>2012-09-01</td>
            <td class="center">Abc</td>
            <td class="center">23</td>
            <td>Approved</td>
            <td>action</td>
        </tr>
        <tr class="even_gradeC" id="4">
            <td><input type="checkbox" value="4" name="check4"></td>
            <td>Red Cross</td>
            <td>Educational</td>
            <td>2012-09-01</td>
            <td class="center">Abc</td>
            <td class="center">23</td>
            <td>Approved</td>
            <td>action</td>
        </tr>
        <tr class="odd_gradeX" id="2">
            <td><input type="checkbox" value="5" name="check5"></td>
            <td class="read_only">Save The Bay</td>
            <td>Educational</td>
            <td>2012-09-01</td>
            <td class="center">Abc</td>
            <td class="center">23</td>
            <td>Approved</td>
            <td>action</td>
        </tr>
        <tr class="even_gradeC" id="4">
            <td><input type="checkbox" value="6" name="check6"></td>
            <td>Red Cross</td>
            <td>Educational</td>
            <td>2012-09-01</td>
            <td class="center">Abc</td>
            <td class="center">23</td>
            <td>Approved</td>
            <td>action</td>
        </tr>
        <tr class="odd_gradeX" id="2">
            <td><input type="checkbox" value="7" name="check7"></td>
            <td class="read_only">Save The Bay</td>
            <td>Educational</td>
            <td>2012-09-01</td>
            <td class="center">Abc</td>
            <td class="center">23</td>
            <td>Approved</td>
            <td>action</td>
        </tr>
        <tr class="even_gradeC" id="4">
            <td><input type="checkbox" value="8" name="check8"></td>
            <td>Red Cross</td>
            <td>Educational</td>
            <td>2012-09-01</td>
            <td class="center">Abc</td>
            <td class="center">23</td>
            <td>Approved</td>
            <td>action</td>
        </tr>
        <tr class="odd_gradeX" id="2">
            <td><input type="checkbox" value="9" name="check9"></td>
            <td class="read_only">Save The Bay</td>
            <td>Educational</td>
            <td>2012-09-01</td>
            <td class="center">Abc</td>
            <td class="center">23</td>
            <td>Approved</td>
            <td>action</td>
        </tr>
        <tr class="even_gradeC" id="4">
            <td><input type="checkbox" value="10" name="check10"></td>
            <td>Red Cross</td>
            <td>Educational</td>
            <td>2012-09-01</td>
            <td class="center">Abc</td>
            <td class="center">23</td>
            <td>Approved</td>
            <td>action</td>
        </tr>
        <tr class="odd_gradeX" id="2">
            <td><input type="checkbox" value="11" name="check11"></td>
            <td class="read_only">Save The Bay</td>
            <td>Educational</td>
            <td>2012-09-01</td>
            <td class="center">Abc</td>
            <td class="center">23</td>
            <td>Approved</td>
            <td>action</td>
        </tr>
        <tr class="even_gradeC" id="4">
            <td><input type="checkbox" value="12" name="check12"></td>
            <td>Red Cross</td>
            <td>Educational</td>
            <td>2012-09-01</td>
            <td class="center">Abc</td>
            <td class="center">23</td>
            <td>Approved</td>
            <td>action</td>
        </tr>
        <tr class="odd_gradeX" id="2">
            <td><input type="checkbox" value="13" name="check13"></td>
            <td class="read_only">Save The Bay</td>
            <td>Educational</td>
            <td>2012-09-01</td>
            <td class="center">Abc</td>
            <td class="center">23</td>
            <td>Approved</td>
            <td>action</td>
        </tr>
        <tr class="even_gradeC" id="4">
            <td><input type="checkbox" value="14" name="check14"></td>
            <td>Red Cross</td>
            <td>Educational</td>
            <td>2012-09-01</td>
            <td class="center">Abc</td>
            <td class="center">23</td>
            <td>Approved</td>
            <td>action</td>
        </tr>
        <tr class="odd_gradeX" id="2">
            <td><input type="checkbox" value="15" name="check15"></td>
            <td class="read_only">Save The Bay</td>
            <td>Educational</td>
            <td>2012-09-01</td>
            <td class="center">Abc</td>
            <td class="center">23</td>
            <td>Approved</td>
            <td>action</td>
        </tr>
        <tr class="even_gradeC" id="4">
            <td><input type="checkbox" value="16" name="check16"></td>
            <td>Red Cross</td>
            <td>Educational</td>
            <td>2012-09-01</td>
            <td class="center">Abc</td>
            <td class="center">23</td>
            <td>Approved</td>
            <td>action</td>
        </tr>
    </tbody>
</table>
<input type="submit" value="submit" id="submit" />

私がやろうとしているのは、初期化時に動的に更新という名前の div を作成し、その div にボタンを追加することですが、そのボタンのクリックが機能しません。

4

3 に答える 3

1

#btn1問題は、が動的に作成されるため、アクション ハンドラーがバインドされないことだと思います。使用する

$("#btn1").on("click", function() {
    alert("refresh clicked");
});

代わりは。

于 2013-10-08T09:42:56.150 に答える