jQuery使用html()设置的内容中含有jQuery代码时,IE浏览器反应迟缓。
最近尝试开发一个简单的在线报表,基本工作流程如下:
index.html页面中有一DIV元素,id="div_result",默认没有任何内容;
index.html页面有一段jQuery代码,作用是使用$.get()向 /test.php 发送请求,返回的内容一个表格 的html代码,使用$("#div_result").html()输出到当前页面的div元素中。
这段返回的html代码(表格)中含有jQuery代码,作用是处理表格样式(隔行变色,选中行高亮显示)。
出现的问题:
在chrome浏览器中:快速在表格上移动鼠标,选中行高亮的特效响应速度非常快。
在所有IE浏览器中:上述特效出现明显的卡顿现象,无论表格行数多少都是如此。
停掉$("div_result").html(),手动在index.html中的div元素下面加入一静态表格并填充测试数据,使用相同的jQuery代码处理表格特效,chrome和IE响应速度都非常快。
主要代码如下:
<code><br><br><div id="result_div"></div> <script> function get_data(tb_typ) { $.ajax({ type:"get", url:"result.php", data:"table_type="+tb_typ, cache:false, success:function(data){$('#result_div').html(data);}, databype:"html"} ) } $(document).ready(function(){ var dataVal = "orders"; get_data(dataVal); //隔行变色,选中高亮 var tb_obj = $('#my_table'); tb_obj.find('tr:even').addClass('row_even'); tb_obj.find('tr:odd').addClass('row_odd'); tb_obj.find('tr').not(':first') .mouseover(function(){ $(this).addClass('tr_over'); }) .mouseout(function(){ $(this).removeClass('tr_over'); }); }); </script> </code>
回复内容:
最近尝试开发一个简单的在线报表,基本工作流程如下:
index.html页面中有一DIV元素,id="div_result",默认没有任何内容;
index.html页面有一段jQuery代码,作用是使用$.get()向 /test.php 发送请求,返回的内容一个表格 的html代码,使用$("#div_result").html()输出到当前页面的div元素中。
这段返回的html代码(表格)中含有jQuery代码,作用是处理表格样式(隔行变色,选中行高亮显示)。
出现的问题:
在chrome浏览器中:快速在表格上移动鼠标,选中行高亮的特效响应速度非常快。
在所有IE浏览器中:上述特效出现明显的卡顿现象,无论表格行数多少都是如此。
停掉$("div_result").html(),手动在index.html中的div元素下面加入一静态表格并填充测试数据,使用相同的jQuery代码处理表格特效,chrome和IE响应速度都非常快。
主要代码如下:
<code><br><br><div id="result_div"></div> <script> function get_data(tb_typ) { $.ajax({ type:"get", url:"result.php", data:"table_type="+tb_typ, cache:false, success:function(data){$('#result_div').html(data);}, databype:"html"} ) } $(document).ready(function(){ var dataVal = "orders"; get_data(dataVal); //隔行变色,选中高亮 var tb_obj = $('#my_table'); tb_obj.find('tr:even').addClass('row_even'); tb_obj.find('tr:odd').addClass('row_odd'); tb_obj.find('tr').not(':first') .mouseover(function(){ $(this).addClass('tr_over'); }) .mouseout(function(){ $(this).removeClass('tr_over'); }); }); </script> </code>

ホットAIツール

Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

AI Hentai Generator
AIヘンタイを無料で生成します。

人気の記事

ホットツール

メモ帳++7.3.1
使いやすく無料のコードエディター

SublimeText3 中国語版
中国語版、とても使いやすい

ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境

ドリームウィーバー CS6
ビジュアル Web 開発ツール

SublimeText3 Mac版
神レベルのコード編集ソフト(SublimeText3)

ホットトピック

PHP 8.4 では、いくつかの新機能、セキュリティの改善、パフォーマンスの改善が行われ、かなりの量の機能の非推奨と削除が行われています。 このガイドでは、Ubuntu、Debian、またはその派生版に PHP 8.4 をインストールする方法、または PHP 8.4 にアップグレードする方法について説明します。

CakePHP でデータベースを操作するのは非常に簡単です。この章では、CRUD (作成、読み取り、更新、削除) 操作について理解します。

ファイルのアップロードを行うには、フォーム ヘルパーを使用します。ここではファイルアップロードの例を示します。

CakePHP は、PHP 用のオープンソース フレームワークです。これは、アプリケーションの開発、展開、保守をより簡単にすることを目的としています。 CakePHP は、強力かつ理解しやすい MVC のようなアーキテクチャに基づいています。モデル、ビュー、コントローラー

CakePHP へのログインは非常に簡単な作業です。使用する関数は 1 つだけです。 cronjob などのバックグラウンド プロセスのエラー、例外、ユーザー アクティビティ、ユーザーが実行したアクションをログに記録できます。 CakePHP でのデータのログ記録は簡単です。 log()関数が提供されています

Visual Studio Code (VS Code とも呼ばれる) は、すべての主要なオペレーティング システムで利用できる無料のソース コード エディター (統合開発環境 (IDE)) です。 多くのプログラミング言語の拡張機能の大規模なコレクションを備えた VS Code は、
