如何在添加新内容时使用jquery获得不同的时间?

时间:2015-12-24 08:55:44

标签: javascript jquery html ajax codeigniter

我使用jQuery添加新的<tr>行,我需要显示点击的当前时间,但它显示重复的时间,如下所示 enter image description here

这是我的代码

<button type="button" class="add_line" id="add_line">+ Add More</button>
                <table class="tbl_add" style="width: 40%; font-size: 16px; ">
                    <tr>
                        <th colspan="7">Add new code <input type="hidden" name="id" id="id" value="<?php echo $code->id;?>"></th>
                    </tr>
                    <tr>
                        <td>Date</td>
                        <td>No.Doc</td>
                        <td>Receive</td>
                        <td>Issue</td>
                        <td>Balance</td>
                        <td>Reference</td>
                        <td>Del</td>
                    </tr>
                </table>

              

<script>
  var i=1;
  var t = '<?php echo date("H:i:s", time());?>';
  $("#add_line").on('click',function(){
    var data="<tr><input type='hidden' id='count' name='count' value='"+i+"'>"+
                " <td><input type='text' id='time_"+i+"' name='time_"+i+"' class='frm_text' value='"+t+"' readonly/><input type='text' id='dt_"+i+"' name='dt_"+i+"' class='frm_text' value='<?php echo date("Y-m-d");?>' readonly/></td>" +
                " <td><input type='text' id='no_doc_"+i+"' name='no_doc_"+i+"' class='frm_text' placeholder='No.Doc' /></td>"+
                " <td><input type='text' id='receive_"+i+"' name='receive_"+i+"' class='frm_text' placeholder='Receive' /></td> "+
                " <td><input type='text' id='issue_"+i+"' name='issue_"+i+"' class='frm_text' placeholder='Issue' /></td> "+
                " <td><input type='text' id='balance_"+i+"' name='balance_"+i+"' class='frm_text' placeholder='Balance'/></td> " +
                " <td><input type='text' id='ref_"+i+"' name='ref_"+i+"' class='frm_text_full' placeholder='Ref.Project' /></td>"+ 
                " <td><a id='btnDelete' class='btnDelete'><img src='<?php echo site_url().'images/minus.png';?>' width='20px' height='20px' ></a></td></tr>";
        $('.tbl_add').append(data);
        i++;
});

  $(".tbl_add").on('click','.btnDelete',function(){
        $(this).closest('tr').remove();

        });
</script>

我怎样才能得到不同的时间,请帮助我。

4 个答案:

答案 0 :(得分:3)

您必须take time every new click,所以只需更改以下代码: -

<script>
    var i=1;
    $("#add_line").on('click',function(){

        var dt  = new Date();
        var t   = dt.getHours() + ":" + dt.getMinutes() + ":" + dt.getSeconds();

        var data="<tr><input type='hidden' id='count' name='count' value='"+i+"'>"+
                    " <td><input type='text' id='time_"+i+"' name='time_"+i+"' class='frm_text' value='"+t+"' readonly/><input type='text' id='dt_"+i+"' name='dt_"+i+"' class='frm_text' value='<?php echo date("Y-m-d");?>' readonly/></td>" +
                    " <td><input type='text' id='no_doc_"+i+"' name='no_doc_"+i+"' class='frm_text' placeholder='No.Doc' /></td>"+
                    " <td><input type='text' id='receive_"+i+"' name='receive_"+i+"' class='frm_text' placeholder='Receive' /></td> "+
                    " <td><input type='text' id='issue_"+i+"' name='issue_"+i+"' class='frm_text' placeholder='Issue' /></td> "+
                    " <td><input type='text' id='balance_"+i+"' name='balance_"+i+"' class='frm_text' placeholder='Balance'/></td> " +
                    " <td><input type='text' id='ref_"+i+"' name='ref_"+i+"' class='frm_text_full' placeholder='Ref.Project' /></td>"+ 
                    " <td><a id='btnDelete' class='btnDelete'><img src='<?php echo site_url().'images/minus.png';?>' width='20px' height='20px' ></a></td></tr>";
        $('.tbl_add').append(data);
        i++;
    });

    $(".tbl_add").on('click','.btnDelete',function(){
        $(this).closest('tr').remove();
    });
</script>

它可能对你有帮助。

答案 1 :(得分:2)

您的PHP代码段(php echo date("H:i:s", time());php echo date("Y-m-d");)仅在加载页面时运行一次,从那时起,t var和{{1中的字符串日期拥有那个日期,永远不会改变......

您需要在每次点击时生成新的日期值,如下所示:

var data

然后你就可以随心所欲地做任何事情:

var t = new Date();

有关var dateValue = t.getFullYear() + '-' + (t.getMonth()+1) + '-' + t.getDate(); // will look like: 2015-12-24 对象的其他选项,请阅读Javascript Date Reference

答案 2 :(得分:2)

您将获得日期,但每次添加新表行时都会获得当前日期和时间,它会在加载该页面时获取存储在变量中的日期和时间。所以你要做的就是你必须创建一个函数,当你要在表中添加一个新行时,它可以返回你当前的日期和时间。

在您的情况下,只有在您运行代码时才会存储日期和时间。

请查看我的代码以获得更多解释。

<!Doctype html>
<html>
    <head>

    </head>

    <body style="margin-bottom: 100px;">
        <button type="button" class="add_line" id="add_line">+ Add More</button>
        <table class="tbl_add" style="width: 40%; font-size: 16px; ">
            <tr>
                <td>Date</td>
                <td>No.Doc</td>
                <td>Receive</td>
                <td>Issue</td>
                <td>Balance</td>
                <td>Reference</td>
                <td>Del</td>
            </tr>
        </table>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
        <script>
            var i = 1;

            //var current_time = new Date(); 

            function getCurrentDateTime(){
                var currentdate = new Date(); 
                    var datetime = currentdate.getDate() + "/"
                        + (currentdate.getMonth()+1)  + "/" 
                        + currentdate.getFullYear() + " "  
                        + currentdate.getHours() + ":"  
                        + currentdate.getMinutes() + ":" 
                        + currentdate.getSeconds();

                return datetime;
            }

            $("#add_line").on('click',function(){

                var date_time = getCurrentDateTime();

                var data="<tr><input type='hidden' id='count' name='count' value='"+i+"'>"+
                        " <td><input type='text' id='time_"+i+"' name='time_"+i+"' class='frm_text' value='"+date_time+"' readonly/><input type='text' id='dt_"+i+"' name='dt_"+i+"' class='frm_text' value='<?php echo date("Y-m-d");?>' readonly/></td>" +
                        " <td><input type='text' id='no_doc_"+i+"' name='no_doc_"+i+"' class='frm_text' placeholder='No.Doc' /></td>"+
                        " <td><input type='text' id='receive_"+i+"' name='receive_"+i+"' class='frm_text' placeholder='Receive' /></td> "+
                        " <td><input type='text' id='issue_"+i+"' name='issue_"+i+"' class='frm_text' placeholder='Issue' /></td> "+
                        " <td><input type='text' id='balance_"+i+"' name='balance_"+i+"' class='frm_text' placeholder='Balance'/></td> " +
                        " <td><input type='text' id='ref_"+i+"' name='ref_"+i+"' class='frm_text_full' placeholder='Ref.Project' /></td>"+ 
                        " <td><a id='btnDelete' class='btnDelete'><img src='<?php echo site_url().'images/minus.png';?>' width='20px' height='20px' ></a></td></tr>";
                $('.tbl_add').append(data);
                i++;
            });

            $(".tbl_add").on('click','.btnDelete',function(){
                $(this).closest('tr').remove();
            });
        </script>
    </body>
</html>

如果你在任何地方都不懂,请告诉我。

答案 3 :(得分:1)

使用 var t = new Date(); // for current time 并在点击功能中使用它。

<script>
  var i=1;
  $("#add_line").on('click',function(){
    var t = new Date(); // for current time
    var data="<tr><input type='hidden' id='count' name='count' value='"+i+"'>"+
                " <td><input type='text' id='time_"+i+"' name='time_"+i+"' class='frm_text' value='"+t+"' readonly/><input type='text' id='dt_"+i+"' name='dt_"+i+"' class='frm_text' value='<?php echo date("Y-m-d");?>' readonly/></td>" +
                " <td><input type='text' id='no_doc_"+i+"' name='no_doc_"+i+"' class='frm_text' placeholder='No.Doc' /></td>"+
                " <td><input type='text' id='receive_"+i+"' name='receive_"+i+"' class='frm_text' placeholder='Receive' /></td> "+
                " <td><input type='text' id='issue_"+i+"' name='issue_"+i+"' class='frm_text' placeholder='Issue' /></td> "+
                " <td><input type='text' id='balance_"+i+"' name='balance_"+i+"' class='frm_text' placeholder='Balance'/></td> " +
                " <td><input type='text' id='ref_"+i+"' name='ref_"+i+"' class='frm_text_full' placeholder='Ref.Project' /></td>"+ 
                " <td><a id='btnDelete' class='btnDelete'><img src='<?php echo site_url().'images/minus.png';?>' width='20px' height='20px' ></a></td></tr>";
        $('.tbl_add').append(data);
        i++;
});

  $(".tbl_add").on('click','.btnDelete',function(){
        $(this).closest('tr').remove();

        });
</script>