首頁猿問 Javascript...

Javascript 打印功能打破下拉表單提交更改

JavaScript

慕標5832272 2023-08-10 15:29:39

我在同一頁面上運行兩個函數(shù)，一個自動提交一個下拉表單來更新變量，另一個用于打印頁面的一部分。它們都按預(yù)期工作，除非我使用打印功能后，它會破壞表單提交功能的工作，除非我重新加載頁面。不確定為什么或如何解決這個問題。 <script> $(function() { $('#daterange').change(function() { this.form.submit(); }); }); </script> <script> function printDiv(printArea) { var printContents = document.getElementById(printArea).innerHTML; var originalContents = document.body.innerHTML; document.body.innerHTML = printContents; window.print(); document.body.innerHTML = originalContents; } </script>

查看完整描述

1 回答

慕妹3242003

TA貢獻1824條經(jīng)驗獲得超6個贊

問題是當您在 printDiv 函數(shù)中重寫文檔時，jQuery 會丟失此處綁定的 onchange 事件的上下文：

$(function() {

? ? $('#daterange').change(function() {

? ? ? ? this.form.submit();

? ? });

});

解決此問題的一種可能的解決方法是使用如下方式將 onChange 事件綁定到動態(tài)創(chuàng)建的元素上：

$(document).change('#daterange', function(e) {

? ? e.preventDefault();

? ? //this.form.submit(); // 'this' is now referring to document thus this.form is undefined.

? ? this.forms[0].submit(); // refer to your form here. this is just an example for reference

? ? //alert('submit called');

});

注意這一部分，這里我們告訴 jquery 將事件與文檔綁定，然后在值更新時$(document).change('#daterange', function(e) {查找該元素。#daterange.change 中的第一個參數(shù)告訴 jQuery 在事件觸發(fā)后查找元素，并且也可以處理動態(tài)創(chuàng)建的元素。

反對回復(fù) 2023-08-10