javascript - 在更改和页面加载时运行 jQuery

Question

我想在选择元素更改和页面加载时运行 jQuery。在这个网页中，我有两个表，用户可以使用 jQuery 将行从 tbl1 移动到 table2，并且一切正常但是当我在选择更改和页面加载时运行 jQuery 时，我无法将行从一个表移动到另一个表这是我希望在页面加载和选择更改时运行的代码

<script>
    $(document).ready(function () {

        $('#Groups').change(function () {

// show that something is loading
//$('#result').html('<img src="images/ajax_loader_red_128.gif"/>')

            var jtarih = $('#Groups').val();

//  alert(jtarih);
//var jadsoyad=$('#adsoyad').val();


            /*
             * 'post_receiver.php' - where you will pass the form data
             * $(this).serialize() - to easily read form data
             * function(data){... - data contains the response from post_receiver.php
             */

            $.post('groupuser.php', {id: jtarih, tarih: jtarih}, function (data) {
                $('#dive').html(data);

// show the response
//    $('#dive').replaceWith(html(data));

            }).fail(function (data) {

// just in case posting your form failed
                $('#dive').html(data);

            });


// to prevent refreshing the whole page page
            return false;

        });
        $('#Groups').trigger('change');
    });
</script>

这是将行从一个表移动到另一个表的 JavaScript 代码，在此代码中一切正常，但是当我运行上面的 JavaScript 代码加载页面时，此代码不起作用

<script>
    $(document).ready(function () {
        $("#product-table2 img.move-row").live("click", function () {
            var tr = $(this).closest("tr").remove().clone();
            tr.find("img.move-row")
                    .attr("src", "images/arrow.png")
                    .attr("alt", "Move");
            $("#product-table tbody").append(tr);
        });

        $("#product-table img.move-row").live("click", function () {
            var tr = $(this).closest("tr").remove().clone();
            tr.find("img.move-row")
                    .attr("src", "images/leftarrow.png")
                    .attr("alt", "Remove");
            $("#product-table2  tbody").append(tr);
        });
    });

</script>

Answer 1

您要在 onload 函数中添加该代码，这意味着在完成页面加载后它将停止工作。您应该关闭该函数，并在 onload 中调用它。

<script>
   $(document).ready(function (){
   mover_fila();
   });

   mover_fila();

   function mover_fila(){
       $('#Groups').change(function () {
           var jtarih = $('#Groups').val();

           $.post('groupuser.php', {id: jtarih, tarih: jtarih}, function (data) {
           $('#dive').html(data);

       }).fail(function (data) {
       $('#dive').html(data);
   });

   return false;

   });
   $('#Groups').trigger('change');
}
</script>

这是第二个代码，用你的 html 检查它的功能。理论上，如果您从 onload 函数中删除代码，它应该可以工作。

<script>
   $(document).ready(function (){
      mover_otra_fila();
   });

   mover_otra_fila();

   function mover_otra_fila(){
       $("#product-table2 img.move-row").live("click", function () {
           var tr = $(this).closest("tr").remove().clone();
           tr.find("img.move-row")
                   .attr("src", "images/arrow.png")
                   .attr("alt", "Move");
           $("#product-table tbody").append(tr);
       });

       $("#product-table img.move-row").live("click", function () {
           var tr = $(this).closest("tr").remove().clone();
           tr.find("img.move-row")
                   .attr("src", "images/leftarrow.png")
                   .attr("alt", "Remove");
           $("#product-table2  tbody").append(tr);
       });
   }
</script>

祝你好运，我希望它有用。