Bagaimana untuk Mengira Peratusan Tatal dalam JavaScript untuk Pelayar Berbeza?

Menentukan Peratusan Tatal dalam JavaScript: Pendekatan Merentas Penyemak Imbas

Untuk keserasian silang penyemak imbas dalam menentukan peratusan tatal menegak selesai, kaedah serba boleh diperlukan. Walaupun rangka kerja seperti Dojo, jQuery, Prototaip dan Mootools mungkin menawarkan penyelesaian, kami akan menyelidiki pendekatan JavaScript asli.

Pelaksanaan JavaScript Asli

Menggunakan sifat 'scrollTop' dan 'scrollHeight', kita boleh mengira peratusan tatal seperti berikut:

<code class="javascript">var h = document.documentElement, 
b = document.body,
st = 'scrollTop',
sh = 'scrollHeight';

var percent = (h[st]||b[st]) / ((h[sh]||b[sh]) - h.clientHeight) * 100;</code>

Kaedah ini secara berkesan menentukan peratusan tatal dalam semua penyemak imbas utama, termasuk Chrome, Firefox dan IE9 .

Pelaksanaan jQuery (Jawapan Asal)

Walaupun penyelesaian asli adalah cekap, kami juga menyediakan pelaksanaan jQuery daripada jawapan asal:

<code class="javascript">$(window).on('scroll', function(){
  var s = $(window).scrollTop(),
      d = $(document).height(),
      c = $(window).height();

  var scrollPercent = (s / (d - c)) * 100;
});</code>

Nota: Potensi Percanggahan pada Pelayar Mudah Alih

Adalah penting untuk ambil perhatian bahawa kaedah yang disediakan mungkin tidak mencapai ketepatan 100% pada penyemak imbas mudah alih moden disebabkan oleh tingkah laku UI autohide-on-scroll. Walau bagaimanapun, untuk kebanyakan senario, ia harus memberikan anggaran peratusan tatal yang boleh dipercayai merentas pelbagai penyemak imbas.

Atas ialah kandungan terperinci Bagaimana untuk Mengira Peratusan Tatal dalam JavaScript untuk Pelayar Berbeza?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!