Ringkasan beberapa kaedah untuk mencapai penyegaran separa iframe dalam kemahiran JavaScript_javascript

WBOY
Lepaskan: 2016-05-16 15:21:33
asal
1600 orang telah melayarinya

Iframe ialah satu bentuk bingkai yang dibenamkan dalam halaman web. Halaman web boleh menyegarkan sebahagian kandungan dengan menukar bahagian yang dibenamkan.

Penggunaan Iframe adalah serupa dengan elemen teg biasa DIV Anda boleh menentukan kedudukan, warna, reka letak antara muka, dll. untuk dibenamkan dalam halaman

1 Kaedah 1 untuk melaksanakan penyegaran separa iframe

<script type="text/javascript">
 $(function(){
 $("#a1").click(function(){
  var name= $(this).attr("name");
  $("#iframe").attr("src",name).ready();
 })
 $("#a2").click(function(){
  var name= $(this).attr("name");
  $("#iframe").attr("src",name).ready();
 })
})
</script>
<a href="#" id="a1" name="a1.html">1</a>
<a href="#" id="a2" name="a2.html">2</a>
<iframe src="" id="iframe"></iframe> 
Salin selepas log masuk

Apabila anda mengklik a1, kandungan a1.html akan dipaparkan dalam iframe Apabila anda mengklik a2, kandungan a2.html akan dipaparkan dalam iframe

2. Kaedah 2 melaksanakan penyegaran separa iframe

<a href="a1.html" id="a1" name="a1.html" target="i">1</a>
<a href="a2.html" id="a2" name="a2.html" target="i">2</a>
<iframe src="" id="iframe" name="i"></iframe> 
Salin selepas log masuk

Catatan:

juga mempunyai atribut sasaran, yang mempunyai kesan yang sama seperti jika ke a1.html Jika terdapat req.set atau session.set dalam Tindakan, ia juga boleh dipaparkan dalam iframe.

Tiga: Kaedah tiga untuk iframe mencapai muat semula separa:

<iframe src="1.htm" name="ifrmname" 
id="ifrmid"></iframe>
Salin selepas log masuk

Pilihan 1: Gunakan atribut nama iframe untuk mencari

<input type="button" name="Button" value="Button" onclick="document.frames('ifrmname').location.reload()">
Salin selepas log masuk

atau

<input type="button" name="Button" value="Button" onclick="document.all.ifrmname.document.location.reload()">
Salin selepas log masuk

Pilihan 2: Gunakan atribut id iframe untuk mencari

<input type="button" name="Button" value="Button" onclick="ifrmid.window.location.reload()">
Salin selepas log masuk

Pilihan 3: Apabila src iframe ialah alamat tapak web lain (semasa mengendalikan domain silang)

<input type="button" name="Button" value="Button" onclick="window.open(document.all.ifrmname.src,'ifrmname','')">
Salin selepas log masuk

Pilihan 4: Dapatkan muat semula separa dengan menggantikan src iframe dengan

Anda boleh menggunakan document.getElementById("iframname").src="" untuk mengubah hala iframe

Kod sampel adalah seperti berikut: test.html

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title></title>
 <script type="text/javascript">
  function partRefresh() {
   document.getElementById("iframe1Id").src = "a2.html"; // 方法一: 通过和替换iframe的src来实现局部刷新
  }
 </script>
 </head>
 <body>
  <table border="1" width="90%" align="center">
   <tr
    style="background: #F0F0E4"><td>方格1</td><td>方格2</td> <td>方格3</td>
   </tr>
   <tr>
    <td>
     <iframe src="a1.html" id="iframe1Id" name="iframe1Name" width="100%"></iframe>
    </td>
    <td>
     <iframe src="a2.html" id="iframe2Id" name="iframe2Name" width="100%"></iframe>
    </td>
    <td>
     <iframe src="a3.html" id="iframe3Id" name="iframe3Name" width="100%"></iframe>
    </td>
   </tr>
  </table>
  <br>
  <br>
  <input type="button" value="IFRAME局部刷新" style="margin-left: 70px;" onclick="partRefresh();">
 </body>
</html> 
Salin selepas log masuk

Kandungan di atas memperkenalkan kepada anda ringkasan beberapa kaedah untuk mencapai penyegaran separa iframe dalam JavaScript Saya harap anda boleh memilih yang sesuai dengan keperluan anda Jika anda mempunyai sebarang pertanyaan, sila tinggalkan saya mesej. terima kasih!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!