亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

統計動態行數并顯示在html的輸入框中

統計動態行數并顯示在html的輸入框中

夢里花落0921 2023-08-18 10:26:18
我試圖計算 html 表中的動態行數,其中在計算行數時,它也在計算表頭,并且我想在輸入框中顯示行數。$(document).ready(function(){     $(".count").click(function(){                    // Select all the rows in the table         // and get the count of the selected elements         var rowCount = $("#tbpnr tr").length;         var x = document.write(rowCount*280).innerHTML;          return(x);        document.getElementById("answer").value = x;    }); });
查看完整描述

2 回答

?
一只斗牛犬

TA貢獻1784條經驗 獲得超2個贊

此代碼將計算表主體中的行數,并將行數 * 280 放入輸入元素中。


$(document).ready(function() {

  $(".count").click(function() {

    var rowCount = $("#tbpnr tr").length;

    document.getElementById("count").textContent = rowCount;

    document.getElementById("answer").value = rowCount * 280;

  });

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<table>

  <thead>

    <tr>

      <th></th>

      <th></th>

      <th></th>

      <th></th>

    </tr>

  </thead>

  <tbody id="tbpnr">

    <tr>

      <td></td>

      <td></td>

      <td></td>

      <td></td>

    </tr>

    <tr>

      <td></td>

      <td></td>

      <td></td>

      <td></td>

    </tr>

    <tr>

      <td></td>

      <td></td>

      <td></td>

      <td></td>

    </tr>

    <tr>

      <td></td>

      <td></td>

      <td></td>

      <td></td>

    </tr>

    <tr>

      <td></td>

      <td></td>

      <td></td>

      <td></td>

    </tr>

    <tr>

      <td></td>

      <td></td>

      <td></td>

      <td></td>

    </tr>

    <tr>

      <td></td>

      <td></td>

      <td></td>

      <td></td>

    </tr>

    <tr>

      <td></td>

      <td></td>

      <td></td>

      <td></td>

    </tr>

    <tr>

      <td></td>

      <td></td>

      <td></td>

      <td></td>

    </tr>

    <tr>

      <td></td>

      <td></td>

      <td></td>

      <td></td>

    </tr>

    <tr>

      <td></td>

      <td></td>

      <td></td>

      <td></td>

    </tr>

    <tr>

      <td></td>

      <td></td>

      <td></td>

      <td></td>

    </tr>

  </tbody>

</table>

<button class="count">Count</button>

<br>

Number of rows:

<b id="count"></b>

<br>

Number of rows * 280:

<input id="answer" />



查看完整回答
反對 回復 2023-08-18
?
縹緲止盈

TA貢獻2041條經驗 獲得超4個贊

您可以使用jQuery它本身來添加框中的計數input。嘗試使用下面的代碼來顯示內部的計數input。


$(document).ready(function(){ 

    $(".count").click(function(){            

        // Select all the rows in the table 

        // and get the count of the selected elements 

        var rowCount = $("#tbpnr tr").length; 

        $("#answer").attr("value", rowCount*280)

    }); 

});

請添加表格的 HTML 以解決表格標題計數問題。


查看完整回答
反對 回復 2023-08-18
  • 2 回答
  • 0 關注
  • 193 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號