Sự kiện nào được kích hoạt sau khi trình duyệt đã tải xong tư liệu html , applet hay image?
|
Show Đầu tiên, tránh hộp nhắc bật lên Tìm kiếm trực tuyến, hầu hết các câu trả lời đang đặt window.onbeforeunload=null, nhưng chúng không hợp lệ sau khi thử. Sau hai ngày, câu hỏi này trở lại một lần nữa, cuối cùng tôi đã tìm thấy câu trả lời, ở đây để chia sẻ với bạn: Nâng jquery để lại bom trang vào trò chơi (1) lần đầu tiên nhả ràng buộc trong nội dung bật lên của bộ là null. $(function(){$(window).unbind('beforeunload');window.onbeforeunload = null;})Thứ hai, liên quan khác [Tóm tắt] (1) Các sự kiện window onunload và onbeforeunload . Sau đây đạt được trong js, không phải Mô hình 2:function close(){if(document.body.clientWidth-event.clientX< 170&&event.clientY< 0||event.altKey){alert("this is a test");}}window.onbeforeunload=close;Sao chép mã Giới thiệu về mô hình 1: 1). Làm mới, nhiều cửa sổ và cửa sổ đơn đều phù hợp. 2). Cửa sổ đơn ie đóng toàn bộ kích hoạt ie. Tắt kích hoạt trang một lần trong nhiều cửa sổ 3) .ie7 4) Các kích hoạt làm mới nhiều cửa sổ khác. Đóng đơn và đóng toàn bộ, không kích hoạt Cho Model 2: Cửa sổ đơn 1) .ie và nhiều cửa sổ ie7, tắt toàn bộ trình duyệt để kích hoạt 2). Các trình duyệt nhiều cửa sổ khác Làm mới. Tắt một trang, Đóng toàn bộ, Không kích hoạt (2) Tạo một hộp nhắc lại . Sự kiện Bind beforeunload $(window).bind('beforeunload',function(){return ' Đầu vào của bạn chưa được lưu, hãy đảm bảo bạn rời khỏi trang này??';});Ràng buộc phát hành $(window).unbind('beforeunload');window.onbeforeunload = null;Trên đây là tất cả các nội dung được mô tả trong bài viết này, tôi hy vọng mọi người có thể thích nó. Page 2ZeroClipboard.js là một plugin JavaScript mà hỗ trợ nhân rộng và dán. Quan chức này đã đến trong 2.x, nhưng không hỗ trợ trình duyệt dưới đây IE9, và nếu nó là tương thích, bạn có thể sử dụng phiên bản 1.x, tôi sử dụng phiên bản đầu tiên của sự khởi đầu. : 1.0.7.Phiên bản này hỗ trợ IE7 và IE8, hôm nay chủ yếu là giới thiệu cách sử dụng một flash để hỗ trợ nhiều văn bản sao chép. Nói chung, chúng ta cần phải sao chép một nơi, hầu hết trong số đó sử dụng đoạn mã sau để tạo ra một đối tượng mới: Độc thân: var clip = null;đối tượng //ZeroClipboard.Clientvar current_id = null;// yếu tố văn bản hiện tại id//Xác định vị trí ZeroClipboard.swfZeroClipboard.setMoviePath(location.protocol+"//club.pcauto.com.cn/js/ZeroClipboard.swf");clip = new ZeroClipboard.Client();// Tạo một đối tượng ZeroClipboard.Clientclip.setHandCursor(true);// Sau khi di chuyển chuột để nguyên tố này, các tay sẽ được hiển thị.clip.glue('J_copy_btn1','J_pop_share');clip.setText($('#J_video_iframe1').val());//Hoạt động sau khi thêm thành công sao chépclip.addEventListener('complete', function() {alert(' sao chép thành công');});Nếu có một số từ, là có một Bốn đối tượng flash mới?Những người có thể đã không cố gắng sẽ làm được điều này, bài viết này cổ phiếu thực tế khác, trên cơ sở flash này, khi chuyển sang nút khác, thay đổi vị trí của flash và sao chép văn bản. đang HTML cho nhiều văn bản: javascript mã: Trên cơ sở js trên, thêm đoạn mã sau //Đoạn mã trên$(".btn-copy-text").each(function(i){var index =i+1;$(this).on('mouseover',function(){var button_id = $ (this).attr('id');// Sao chép id của div//var text_id = button_id+'_text';// phần tử để sao chép idvar text_id = 'J_video_iframe'+(index);move_swf(text_id , button_id);});});//Di chuyển flash div nổi đến nơi quy định, vì vậy bạn chỉ cần sử dụng một flash để thực hiện chức năng sao chép ở nhiều nơi.function move_swf(text_id,button_id) {//Tái định vị trí flash div nổi, sử dụng repositionclip.reposition(button_id, 'J_pop_share');clip.setText($('#'+text_id).val());}Khi sử dụng ZeroClipboard.js, sao chép không làm việc hoặc lạ bug khác, ví dụ, trong IE ngày hôm nay, bởi vì nội dung được đặt trong cửa sổ pop-up, sao chép đầu tiên, nhưng thứ hai sẽ báo cáo lỗi, Mẹo "Không có như vậy đối tượng", gỡ lỗi trong một thời gian dài, không bao giờ được giải quyết, và sau đó không ẩn các cửa sổ pop-up, nhưng tôi sẽ không báo cáo lỗi, vì vậy tôi nghĩ rằng nó nên là flash ẩn và hiển thị, đặt cửa sổ ẩn sổ pop-up vị trí tuyệt đối cộng left:-9999px, hiển thị Vào thời điểm đó, giá trị left đúng sẽ không được báo cáo một cách chính xác. Page 3Nếu bạn muốn sử dụng Cocos Creator thực hiện một số trò chơi hơi lớn, quản lý tài nguyên là vấn đề phải được giải quyết. Với vở kịch của trò chơi, bạn có thể thấy rằng bộ nhớ của trò chơi chỉ được dỡ bỏ, ngay cả khi bạn đang chỉ được sử dụng Tài nguyên rất ít, và có việc sử dụng các cc.loader.release để giải phóng tài nguyên được tải trước đây, nhưng hầu hết các nguồn lực sử dụng trước khi nó sẽ ở lại trong ký ức!Tại sao cái này rất? vấn đề quản lý tài nguyên cocos creatorquản lý tài nguyên chủ yếu là giải quyết ba vấn đề, tải tài nguyên, phát hiện tài nguyên (sử dụng), phát hành tài nguyên.Vấn đề chính để thảo luận ở đây là rất đơn giản, vấn đề này rất đơn giản, nó thực sự là rất đơn giản trong Cocos2d-x, nhưng nó được nhiều phức tạp trong js, bởi vì rất khó để theo dõi nếu một nguồn tài nguyên có thể được phát hành. Trong Cocos2d-x, chúng tôi sử dụng các tính tham khảo, giải phóng tài nguyên khi đếm tham chiếu là 0, số lượng tài liệu tham khảo bảo trì, và trong Cocos2d-x, quản lý của chúng tôi được phân tán trở lên, mức động cơ là chỉ có sẵn như TextureCache, AudioManager Độc ví dụ để quản lý tài nguyên nhất định , hầu hết các nguồn tài nguyên yêu cầu chúng tôi để quản lý, và trong cocos creator, tài nguyên của chúng tôi được quản lý bởi cc.loader, một số lượng lớn các prefab, prefab và tài nguyên khác nhau phức tạp các mối quan hệ tài liệu tham khảo tăng khó khăn trong việc quản lý tài nguyên. sự phụ thuộc tài nguyênTài nguyên một thể dựa vào tài nguyên B, C, D, và tài nguyên D dựa vào E tài nguyên, mà là một sự phụ thuộc tài nguyên rất phổ biến, nếu chúng ta sử dụng cc.loader.loadRes("A") tài nguyên tải a, b ~ e sẽ được nạp, nhưng nếu chúng ta gọi là cc.loader.release("A") chỉ có tài nguyên một phát hành. PIC - 1Mỗi tài nguyên được nạp sẽ được đặt trong _cache của cc.loader, nhưng cc.loader.release chỉ phát hành vào nguồn lực đến mà không xem xét các điều kiện tài nguyên phụ thuộc. Nếu bạn đang quan tâm trong quá trình tải tài nguyên đằng sau cc.loader, bạn có thể tham khảo: https://www.cnblogs.com/ybgame/p/10576884.html Nếu chúng ta muốn giải phóng tài nguyên, cocos creator cung cấp một cách tiếp cận vụng về, cc.loader.getDependsRecursively;, đệ quy tất cả các nguồn lực phụ thuộc vào tài nguyên quy định phụ thuộc, đặt nó vào mảng, sau đó vượt qua các mảng trong cc.loader.release, cc.loader sẽ đi qua chúng Thả nó từng cái một. Mặc dù tài nguyên có thể được phát hành, nó có thể giải phóng nguồn lực mà không nên được phát hành. Nếu có một nguồn lực F phụ thuộc D, nó sẽ gây ra các nguồn lực F để làm việc đúng cách.Kể từ khi động cơ cocos creator không duy trì sự phụ thuộc của các nguồn lực, nó không biết làm thế nào để dựa vào chúng tôi khi chúng tôi phát hành D.Thậm chí nếu không có F, chúng tôi không xác định nếu D, ví dụ, chúng ta gọi là cc.loader tải D, và sau đó tải A, sau đó D đã được nạp, A có thể được sử dụng trực tiếp.Nhưng nếu bạn phát hành A, nó cũng được phát hành, mà không phải là phù hợp với sự mong đợi của chúng tôi. Chúng tôi hy vọng rằng D không nên phát hành với các nguồn lực khác mà không phát hành một cách rõ ràng D. Bạn có thể chỉ đơn giản là kiểm tra, bạn có thể mở chế độ nhà phát triển Chrome, đầu vào trong bảng điều khiển Console, nếu nó là phiên bản cũ của cocos creator có thể tất cả các kết cấu của dump trong cc.textureCache, và các phiên bản mới được chuyển đến textureCache, nhưng chúng tôi có thể nhập cc.loader._cache Xem tất cả các nguồn lực.Nếu có quá nhiều tài nguyên, chỉ số mối quan tâm, bạn có thể nhập Object.keys(cc.loader._cache).length để xem tổng số tài nguyên, chúng ta có thể tải dump lần trong tải tài nguyên, sau đó dump một lần, sau khi phát hành dump một lần, so sánh tình trạng bộ nhớ cache trong cc.loader .Tất nhiên, bạn cũng có thể viết một số phương pháp thuận tiện, chẳng hạn như chỉ ảnh dump, hoặc dump và mục chênh lệch dump cuối cùng. PIC - 2Sử dụng tài nguyênNgoài các vấn đề tài nguyên phụ thuộc, chúng ta cũng cần phải giải quyết vấn đề sử dụng tài nguyên. Điều thứ nhất là vấn đề tổ chức nguồn lực bên trong cc.loader. Loại thứ hai là vấn đề sử dụng tài nguyên của lớp ứng dụng logic. Ví dụ, chúng ta cần phải phát hành một số tài nguyên khi nó được đóng lại, ý chí cùng Đối mặt với một vấn đề mà không nên được phát hành, chẳng hạn như liệu giao diện unsturned khác sử dụng tài nguyên này?Nếu có những nơi khác để sử dụng nguồn tài nguyên này, thì bạn không nên thả nó! ResLoaderỞ đây tôi đã thiết kế một ResLoader để giải quyết những vấn đề mà cc.loader không giải quyết, chính là để tạo ra một CacheInfo với các nguồn lực ghi thông tin phụ thuộc và sử dụng để xác định xem các tài nguyên có thể được phát hành, sử dụng để thay thế ResLoader.getInstance().loadRes() cc.loader.loadRes(), ResLoader.getInstance().releaseRes() để thay thế cc.loader.releaseRes(). Đối với phụ thuộc, ResLoader tự động thiết lập ánh xạ khi tải tài nguyên, nguồn lực phát hành, và phát hiện cho dù tài nguyên sau khi huỷ bản đồ có thể được phát hành, nó là logic. Để sử dụng, một tham số use được cung cấp, và tham số này được sử dụng để sử dụng nguồn tài nguyên này, và nếu có chỗ nào khác để sử dụng tài nguyên, khi một tài nguyên không giới hạn, nó không được sử dụng bởi logic khác, sau đó Tài nguyên này có thể được phát hành. /*** lớp tải tài nguyên* 1. Tự động ghi lại các mối quan hệ tài liệu tham khảo sau khi tải, theo bản ghi DependKeys phụ thuộc ngược* 2. Hỗ trợ sử dụng tài nguyên, chẳng hạn như một UI mở sử dụng Một tài nguyên, nơi khác nguồn phát hành B, tài liệu tham khảo tài nguyên B nguồn lực một, nếu không có nguồn lực Một nguồn tài liệu tham khảo khác, việc phát hành các tài nguyên A sẽ được kích hoạt,* 3. Có thể phát hành một cách an toàn các tài nguyên phụ thuộc (một nguồn tài nguyên cũng được tham chiếu bởi nhiều nguồn lực, chỉ khi các nguồn lực khác được giải phóng, các nguồn tài nguyên sẽ được phát hành.)** 2018-7-17 by Baoye*/// Resource callback xử lý tảiexport type ProcessCallback = (completedCount: number, totalCount: number, item: any) => void;// Resource tải hoàn callbackexport type CompletedCallback = (error: Error, resource: any) => void;// Trích dẫn và sử dụng các cấu trúcinterface CacheInfo {refs: Setsử dụng ResLoaderCác ResLoader là rất đơn giản. Đây là một ví dụ đơn giản, chúng ta có thể nhấp vào nút dump để xem số lượng hiện tại của các nguồn lực, nhấp cc.load, cc.release, tương ứng, dump một lần, bạn có thể thấy rằng có 36 nguồn lực, và có 40 nguồn sau khi tải, sau khi thực hiện được phát hành, có 39 nguồn lực, chỉ phát hành một tài nguyên. Nếu bạn sử dụng ResLoader để kiểm tra, chỉ có 34 nguồn lực sau khi được thả, bởi vì các nguồn lực của cảnh tải trước đó cũng phụ thuộc vào tài nguyên kiểm tra, do đó, những nguồn lực cũng được phát hành, miễn là chúng ta sử dụng ResLoader để tải và nguồn lực gỡ bỏ cài đặt, không có vấn đề rò rỉ tài nguyên. PIC - 3Mã mẫu: @ccclassexport default class NetExample extends cc.Component {@property(cc.Node)attachNode: cc.Node = null;@property(cc.Label)dumpLabel: cc.Label = null;onLoadRes() {cc.loader.loadRes("Prefab/HelloWorld", cc.Prefab, (error: Error, prefab: cc.Prefab) => {if (!error) {cc.instantiate(prefab).parent = this.attachNode;}});}onUnloadRes() {this.attachNode.removeAllChildren(true);cc.loader.releaseRes("Prefab/HelloWorld");}onMyLoadRes() {ResLoader.getInstance().loadRes("Prefab/HelloWorld", cc.Prefab, (error: Error, prefab: cc.Prefab) => {if (!error) {cc.instantiate(prefab).parent = this.attachNode;}});}onMyUnloadRes() {this.attachNode.removeAllChildren(true);ResLoader.getInstance().releaseRes("Prefab/HelloWorld");}onDump() {let Loader:any = cc.loader;this.dumpLabel.string = nguồn lực hiện tại tổng: $ {Object.keys(Loader._cache).length};}}Có thể thấy rằng ở trên ví dụ là để loại bỏ các nút đầu tiên, phát hành nó, đây là cách đúng đắn về sử dụng, nếu tôi không loại bỏ phát hành trực tiếp?TrongKể từ khi kết cấu được phát hành, cocos creator sẽ tiếp tục báo cáo trong vẽ tiếp theo. ResLoader chỉ là một nền tảng, trực tiếp sử dụng ResLoader, chúng tôi không cần phải quan tâm về nguồn lực, nhưng việc sử dụng các nguồn lực Chúng tôi cũng cần phải cẩn thận. Trong thực tế sử dụng, chúng ta có thể muốn vòng đời của các nguồn lực để có các trường hợp sau:
Chúng tôi có thể thực hiện một bộ phận treo lên để các đối tượng, khi chúng tôi viết logic trong các thành phần khác của đối tượng, tải các tài nguyên, sử dụng thành phần quản lý tài nguyên này để tải, theo đó các thành phần được duy trì.Giao diện và cảnh tương tự.. Mã dự án tọa lạc tại: https://github.com/wyb10a10/cocos_creator_framework, mở cảnh ResExample của thư mục Scene để xem. Page 4Trước khi đề cập đến các khái niệm trên, đầu tiên muốn nói về các thông số ngụ ý của các chức năng trong javascript: arguments Arguments Đối tượng này đại diện cho chức năng của hàm được thực thi và các chức năng gọi nó. [function.]arguments[n] Parameter function: Options.Tên của đối tượng Function hiện đang được thực hiện.n: Options.Để vượt qua các giá trị tham số chỉ số bắt đầu từ 0 từ đối tượng Function. Minh họa Các Arguments là một đối tượng ẩn mà cũng được tạo ra, thêm vào các thông số quy định ngoài việc gọi hàm.Arguments là một mảng tương tự nhưng không phải là một đối tượng mảng, nói rằng nó cũng tương tự như tính chất truy cập cùng và chế độ, có thể truy cập giá trị của các thông số cá nhân tương ứng bởi arguments[n], và có một length mảng chiều dài thuộc tính.Ngoài ra còn có các đối tượng arguments lưu trữ bởi các tham số thực sự truyền cho hàm, không khai báo hàm danh sách tham số được xác định, và không thể dứt khoát tạo các đối tượng arguments.Các đối tượng arguments chỉ có sẵn khi chức năng bắt đầu.Ví dụ sau đây chi tiết các đặc tính này: //Cách sử dụng của các đối tượng arguments.function ArgTest(a, b){var i, s = "The ArgTest function expected ";var numargs = arguments.length;/ / Lấy giá trị của các thông số truyền.var expargs = ArgTest.length;/ / Lấy giá trị của tham số mong muốn.if (expargs < 2)s += expargs + " argument. ";elses += expargs + " arguments. ";if (numargs < 2)s += numargs + " was passed.";elses += numargs + " were passed.";s += "\n\n"for (i =0 ;i < numargs;i++) {// Nhận tham số nội dung.s += " Arg " + i + " = " + arguments[i] + "\n";}return(s);// Quay lại danh sách tham số.}Thêm một mã mô tả arguments không phải là một lớp mảng (Array: Array.prototype.selfvalue = 1;alert(new Array().selfvalue);function testAguments(){alert(arguments.selfvalue);}Bạn sẽ tìm thấy đầu tiên hiển thị alert 1, có nghĩa là đối tượng mảng có một tài sản selfvalue, giá trị là 1, và khi bạn gọi testAguments chức năng, bạn sẽ tìm thấy "undefined", có nghĩa là tài sản không phải là arguments, mà là, arguments không phải là một đối tượng mảng. caller Trả về một tham chiếu đến các chức năng mà các cuộc gọi chức năng hiện tại. functionName.caller functionName đối tượng là tên của hàm thực thi. Minh họa Đối với chức năng, thuộc tính caller chỉ được xác định khi chức năng được thực thi.Nếu hàm được gọi bởi lớp trên cùng, các caller chứa null.Nếu thuộc tính caller được sử dụng trong bối cảnh của chuỗi, kết quả là như functionName.toString, có nghĩa là, việc soạn thảo văn bản ngược của hàm sẽ được hiển thị. Ví dụ sau minh họa việc sử dụng các thuộc tính caller: // caller demo {function callerDemo() {if (callerDemo.caller) {var a= callerDemo.caller.toString();alert(a);} else {alert("this is a top function");}}function handleCaller() {callerDemo();}callee Lợi nhuận đối tượng Function được thực thi, có nghĩa là, cơ thể của đối tượng quy định Function. [function.]arguments.callee Tùy chọn function tham số là tên của đối tượng Function rằng hiện đang thực hiện. Minh họa Giá trị ban đầu của thuộc tính callee là đối tượng Function được thực thi. Thuộc tính callee là thành viên của đối tượng arguments, mà chỉ ra một tham chiếu đến đối tượng chức năng riêng của mình, trong đó tạo điều kiện cho đệ quy của hàm ẩn danh hoặc để đảm bảo việc đóng gói các chức năng, chẳng hạn như việc tính toán đệ quy trong tổng số 1 đến N bên dưới. Thiên nhiên .Và thuộc tính này chỉ có sẵn khi các chức năng có liên quan đang được thực hiện.Nó cũng là cần thiết để lưu ý rằng callee có tính length, mà đôi khi được dùng để xác minh hoặc tốt hơn.arguments.length là chiều dài tham số đầu tiên, arguments.callee.length là chiều dài của hình dạng, từ đó xác định liệu thời gian gọi là phù hợp với độ dài tham số đầu tiên. Thí dụ //callee có thể in bản thânfunction calleeDemo() {alert(arguments.callee);}//Được sử dụng để xác minh các thông sốfunction calleeLengthDemo(arg1, arg2) {if (arguments.length==arguments.callee.length) {window.alert(" biên tập viên xác minh và độ dài behen rắn là chính xác!");return;} else {alert(" rắn dài tham số: " +arguments.length);alert(" dài meticin: " +arguments.callee.length);}}//tính toán đệ quyvar sum = function(n){if (n <= 0)return 0;elsereturn n ＋arguments.callee(n - 1)}chức năng đệ quy tổng quát: var sum = function(n){if (n<=0)return 0;elsereturn n + sum (n-1);}Khi gọi: alert(sum(100)); Chức năng nội bộ chứa một tham chiếu đến sum riêng của mình. Các tên hàm chỉ là một tên biến. Trong cuộc gọi nội sum, nó tương đương với cách gọi một biến toàn cầu. Nó không phải là một sự phản ánh tốt để gọi riêng của mình, sau đó sử dụng callee sẽ là một so sánh phương pháp thích hợp. apply and call vai trò của họ được ràng buộc các chức năng để đối tượng khác, và hai là chỉ khác nhau trong việc xác định các thông số: apply(thisArg,argArray); call(thisArg[,arg1,arg2…] ]); Đó là, con trỏ this bên trong tất cả các chức năng được gán cho thisArg, cho phép mục đích chạy các chức năng như một đối tượng khác hướng dẫn apply Nếu argArray không phải là một mảng hợp lệ hay không đối tượng arguments, sau đó một TypeError sẽ cho kết quả. Nếu bạn không cung cấp bất kỳ thông số của argArray và thisArg, đối tượng sau đó Global sẽ được sử dụng như thisArg, Và không thể chuyển giao cho bất kỳ thông số. hướng dẫn call phương pháp call có thể thay đổi một chức năng của bối cảnh đối tượng từ bối cảnh ban đầu để một đối tượng mới theo quy định của thisArg. Nếu tham số thisArg không được cung cấp, đối tượng Global được sử dụng như thisArg Các kỹ năng liên quan: Áp dụng call và apply và có một bên lừa, và sau khi sử dụng call và apply để áp dụng một chức năng (class), các chức năng hiện tại (lớp) đã một phương pháp chức năng (lớp) hoặc thuộc tính, mà cũng có thể được gọi là Người ta " thừa hưởng".Nhìn vào ví dụ dưới đây: // cuộc biểu tình thừa kếfunction base() {this.member = " dnnsun_Member";this.method = function() {window.alert(this.member);}}function extend() {base.call(this);window.alert(member);window.alert(this.method);}Như có thể thấy ở trên, sau khi call, extend có thể kế thừa phương pháp và thuộc tính của base. Bằng cách này, sử dụng apply để tạo ra một chế độ lớp được định nghĩa trong khuôn khổ prototype javascript, Trên thực tế, mã hiện tại là như sau: var Class = {create: function() {return function() {this.initialize.apply(this, arguments);}}}Phân tích: Từ mã này, đối tượng này chỉ chứa một phương thức: Create, mà trả về một chức năng, tức là lớp.Nhưng đây cũng là constructor của lớp, nơi initialize được gọi, và phương pháp này là chức năng khởi tạo được xác định khi tạo lớp.Với cách này, bạn có thể thực hiện các chế độ tạo lớp trong prototype Thí dụ: var vehicle=Class.create();vehicle.prototype={initialize:function(type){this.type=type;}showSelf:function(){alert("this vehicle is "+ this.type);}}var moto=new vehicle("Moto");moto.showSelf();Page 5
Đúng!Bạn đã không nhìn thấy nó!Vẫn là một bản đồ cuộn.Lần này JQuery là!! CSS mã: Mã HTML: ```js Page 61. Đầu tiên chúng ta phải biết chuỗi phạm vi biến Phạm vi của biến được chia thành hai loại: các biến toàn cục và biến cục bộ.Không có gì để xác định các biến bất kỳ chức năng như các biến toàn cục, các biến được định nghĩa trong chức năng là các biến địa phương, chú ý đến việc sử dụng các từ khóa var khi xác định các biến bên trong hàm, mà không biến var cho các biến toàn cầu. Mỗi mã trong javascript có một chuỗi phạm vi liên kết với nó. Chuỗi phạm vi Đây là một danh sách đối tượng hoặc một danh sách liên kết định nghĩa các biến trong mã "Phạm vi" này.Vai trò của mã cấp cao bao gồm các biến toàn cục;Có hai đối tượng không chứa các chức năng lồng nhau: một là đối tượng được xác định thông số chức năng và các biến cục bộ, một là một đối tượng biến toàn cầu;Phạm vi của hàm lồng nhau có ba đối tượng: các thông số chức năng và các biến địa phương - các thông số và các biến cục bộ của các chức năng bên ngoài - các biến toàn cục.Các chức năng có thể truy cập vào các đối tượng trên phạm vi chuỗi, do đó chức năng có thể truy cập các biến toàn cầu, nhưng đến lượt nó, có nghĩa là, các biến địa phương trong phạm vi chức năng bên ngoài hàm. var a=1;function wai(){alert(a);var m=10;n=20;}wai();/ / => 1;Toàn bộ chức năng có thể truy cập các biến toàn cầualert(m);//=> error;chức năng truy cập bên ngoài lỗi biến địa phươngalert(n);/ / => 20;Biến được định nghĩa bên trong hàm không sử dụng từ khóa var, vì vậy nó là một biến toàn cầu, và bên ngoài có thể được truy cập.2, làm thế nào để đọc các biến cục bộ bên ngoài Đôi khi chúng ta cần phải truy cập vào các biến cục bộ của bên ngoài hội đồng quản trị nội tại. Tại thời điểm này, chúng ta cần phải sử dụng đường để thực hiện.Chúng tôi sử dụng các đặc tính của phạm vi biến javascript, xác định subunies bên trong hàm, các subfunction có thể truy cập các biến trong hàm cha mẹ function wai(){var m=10;function nei(){alert(m);}return nei;}var f = wai();nei();//=> error;Chức năng nei() là một biến địa phương mà không thể được truy cập từ bên ngoài.f(); //=> 10;3, túi đóng Các nei() chức năng của mã cuối cùng là đóng cửa. Từ trên, việc đóng cửa là một chức năng mà có thể đọc các biến cục bộ trong phạm vi chức năng. Đây là một chức năng được xác định bên trong hàm, về cơ bản xem xét nội bộ và chức năng của hàm. Bridge. Hai: Thứ nhất, các biến nêu trên có thể được đọc trong các chức năng đọc Thứ hai, bạn có thể lưu các biến địa phương trong bộ nhớ và thực hiện chia sẻ dữ liệu biến function wai(){var m=99;function nei(){alert(m);m++;}return nei;}var f= wai();f(); //=> 99;f(); //=> 100;f(); //=> 101;Các ví dụ trên là khi chức năng wai() đang chạy, biến m sẽ được lưu vào bộ nhớ, và giá trị của f() có thể đọc các giá trị của M, nhưng trực tiếp alert(m) không phải là! Chúng tôi cũng có thể truyền tham số cho chức năng đóng cửa, như trong ví dụ dưới đây, xác định một chức năng ẩn danh và trả về một hàm đóng cửa, có thêm các thông số đến vào biến địa phương tôi trong chức năng ẩn danh, và làm cho tôi tăng; var wai=(function(){var i=0;return function(num){num+=i;alert(num);i++;}})();wai(1);//1wai(2);//3wai(3);//5Để hiểu được việc đóng cửa, chúng ta hãy nhìn tại một ví dụ dưới đây: Bây giờ tôi muốn xác định một hàm, hàm trả về một mảng, và mỗi phần tử của mảng là một chức năng, mỗi chức năng sẽ bật lên giá trị chỉ số tương ứng Chúng tôi có thể viết theo cách này function box(){var arr=[];for(i=0;i<5;i++){arr[i]=function(){return i;}}return arr;}var a=box();alert(a);/ / => Array chứa năm cơ quan chức năngalert(a[0]()); //=> 5;alert(a[1]()); //=> 5;Đoạn mã trên cho thấy các cửa sổ pop-up là 5, không phải là 0, 1, 2, 3, 4, chúng tôi mong đợi, bởi vì tôi cũng là một biến địa phương hiện có trong bộ nhớ, khi chúng tôi chạy a 0, giá trị của tôi đã là 5, giá trị của tôi không ngừng gia tăng trong hoạt động của toàn bộ chức năng box().. Cách giải quyết: Thực hiện các đóng gói function box(){var arr=[];for(var i=0;i<5;i++){arr[i]=(function(num){return function(){return num;}})(i);}return arr;}var arr=box();for(var i=0;i<5;i++){alert(arr[i]());//0,1,2,3,4}4. Thận trọng khi dùng cho việc sử dụng túi đóng 1) Kể từ khi đóng cửa sẽ làm cho các biến trong hàm được lưu trữ trong bộ nhớ, dung lượng bộ nhớ là lớn, do đó việc đóng cửa không thể bị lạm dụng, nếu không vấn đề hiệu suất của trang web có thể gây rò rỉ bộ nhớ trong IE.Giải pháp là tất cả các biến địa phương đó sẽ không được sử dụng trước khi thoát hàm. 2) Việc đóng cửa sẽ thay đổi giá trị của các biến nội bộ của hàm cha mẹ ở bên ngoài của hàm cha mẹ.Vì vậy, nếu bạn sử dụng chức năng cha mẹ như một đối tượng (object), đặt việc đóng cửa như tiện ích của nó (Public Method), coi các biến nội bộ như tài sản cá nhân của mình (private value), sau đó cẩn thận, không thay đổi biến chức năng tình cờ Chánh. 5, dưới đây là từ một vài điều về túi đóng Nếu bạn có thể hiểu được những kết quả hoạt động của các mã sau đây, bạn nên hiểu cơ chế hoạt động của việc đóng cửa. đang Js var name = "The Window";var object = {name : "My Object",getNameFunc : function(){return function(){return this.name;/ / => this của hàm lồng nhau là một biến toàn cầu hoặc undefined, mà không kế thừa các chức năng mẹ this};}};alert(object.getNameFunc()()); //The WindowKết quả trên là "The window" vì this trong hàm lồng nhau không kế thừa các chức năng mẹ this, và giá trị của nó là dưới biến toàn cầu hoặc undefined(ECMAScript5), do đó trả về biến name cho đối tượng toàn cầu.Để cho nó quay trở lại tài sản của object name, mã này là như sau: var name = "The Window";var object = {name : "My Object",getNameFunc : function(){var cur=this;return function(){return cur.name;};}};alert(object.getNameFunc()()); //=》My ObjectMã chuyển nhượng trên this của hàm mẹ object vào biến cur, và chức năng lồng nhau của nó có thể truy cập vào thuộc tính của nó thông qua các biến cur ------------------------------------------------------------------------------------------------------ JavaScript dụ đóng cửa function outerFun(){var a=0;function innerFun(){a++;alert(a);}}innerFun(); //=>errorĐoạn mã trên là phạm vi .innerFun() sai trong outerFun(), và outerFun() gọi nó là sai. Thay đổi sau đây, có nghĩa là, việc đóng cửa: đang Js function outerFun(){var a=0;function innerFun(){a++;alert(a);}return innerFun;// Lưu ý đây}var obj=outerFun();obj();/ / Kết quả là 1obj();/ / Kết quả là 2var obj2=outerFun();obj2();/ / Kết quả là 1obj2();/ / Kết quả là 2một kết thúc là gì: Khi chức năng nội bộ được định nghĩa một tài liệu tham khảo bên ngoài phạm vi của nó, việc đóng cửa chức năng nội bộ được tạo ra. Nếu tài liệu tham khảo chức năng nội bộ biến nằm trong hàm bên ngoài, các biến này sẽ không phải chịu những ký ức. Phát hành, bởi vì việc đóng cửa cần họ. -------------------------------------------------------------------------------------------------------- Chúng ta hãy lấy một ví dụ đang Js function outerFun(){var a =0;alert(a);}var a=4;outerFun(); //=> 0alert(a); //=> 4Kết quả là 0, 4. Bởi vì vai trò của bảo trì var từ khóa A được sử dụng bên trong hàm trong outFun() bên trong. Nhìn vào mã bên dưới: đang Js function outerFun(){//không vara =0;alert(a);}var a=4;outerFun(); //=> 0alert(a); //=> 0Kết quả là 0, 0 là thực sự kỳ lạ, tại sao? Chuỗi miền hành động là một thuật ngữ mô tả một con đường, mà có thể xác định giá trị của biến dọc theo con đường. Khi a=0 được thực thi, bởi vì từ khóa var không được sử dụng, các hoạt động nhiệm vụ sẽ là dọc theo chuỗi phạm vi để var a=4;.Và thay đổi giá trị của nó. Page 7Qua bài viết trước, các dữ liệu kinh doanh chức năng nhập khẩu hàng loạt được thực hiện. Bài viết này chủ yếu giới thiệu các nội dung tải lên có liên quan. Giới thiệuCác crudapi hỗ trợ các lĩnh vực tập tin đính kèm, lưu bên trong lĩnh vực bảng là file url chuỗi.File đính kèm có thể được tải lên bởi hệ thống quản lý tài liệu khác như Ali đám mây OSS, hoặc sử dụng API quản lý tập tin riêng của hệ thống để tải lên, bao gồm việc tải tập tin bình thường và tập tin lát lớn tải lên hai cách. giao diện UIPIC - 1file Upload upload tập tin lớn APIPIC - 3Tải lên API, bao gồm việc tải file bình thường và tập tin lát lớn, với các tài liệu swagger cụ thể để xem.Đóng gói api qua axios, tên file import { axiosInstance } from "boot/axios";const HEADERS = {"Content-Type": "multipart/form-data"};const file = {upload: async function(data, progressCallback) {console.log("file->upload")return axiosInstance.post(/api/file , data,{headers: HEADERS,onUploadProgress: (progressEvent) => {if (progressCallback) {progressCallback(progressEvent)}}});},bigUpload: async function(data, progressCallback) {console.log("file->bigUpload")return axiosInstance.post(/api/file/big , data,{headers: HEADERS,onUploadProgress: (progressEvent) => {if (progressCallback) {progressCallback(progressEvent)}}});}};export { file };Mã lõithành phần CFileChuyển sang chế độ upload qua toggle, nếu nó là một file nhỏ để sử dụng một cách bình thường. upload bình thườngasync onSubmitClick() {console.info("CFile->onSubmitClick");if (!this.normalFile) {this.$q.notify({message: ' Hãy chọn tệp!',type: 'warning'});return;}this.$q.loading.show({message: " upload"});try {let form = new FormData()form.append('file', this.normalFile);this.fileInfo = await fileService.upload(form, (e)=> {console.info(e);});this.$q.loading.hide();this.$emit("input", this.fileInfo);} catch (error) {this.$q.loading.hide();console.error(error);}}Big tập tin tải lên látbigFileAdded(f) {console.info("CFile->fileAdded");if (!f) {console.info("CFile->cancel");return;}this.$q.loading.show({chuẩn bị hồ sơ message: ""});FileMd5(f, this.chunkSize, (e, md5) => {this.md5 = md5;console.info(e);console.info(md5);this.$q.loading.hide();});},async onBigSubmitClick() {console.info("CFile->onBigSubmitClick");if (!this.bigFile) {this.$q.notify({message: ' Hãy chọn tệp!',type: 'warning'});return;}this.$q.loading.show({message: " upload"});try {let chunks = this.getChunks();let reqs = [];for (let i = 0; i < chunks; ++i) {reqs.push(this.uploadWithBlock(i));}await Promise.all(reqs).then((datas) => {console.info(datas);this.checkFinished(datas);});} catch (error) {this.$q.loading.hide();console.error(error);}}file lớn Nếu một phương pháp tải lên bình thường được sử dụng, nó có thể là đa luồng bằng cách mạng vì lý do là chậm vì lý do, và không ổn định.Các nguyên tắc cụ thể như sau: Thứ nhất, các tập tin MD5 được tính, và nền sẽ được dựa trên MD5 duy nhất xác định rằng cùng một tập tin sẽ được ghi trong cùng một tập tin theo kích thước và bù đắp, tùy thuộc vào kích thước và bù đắp , khi block cuối cùng là thành công, tải lên kết thúc.giá trị mặc định kích thước Split tới 20MB, có thể được cấu hình theo yêu cầu, phần đầu xe có thể đạt được đa luồng tải lên đồng thời theo phương thức gọi ajax của Promise.all. bảng tập tin là một ví dụPIC - 4Các "Liên kết" lĩnh vực hình thức tập tin đặt kiểu "tập tin đính kèm ATTACHMENT", thêm các trang dữ liệu kinh doanh sẽ tự động sử dụng các thành phần CFile. PIC - 5Sau khi chọn một tập tin lớn, nhấp vào biểu tượng tải lên, khám phá thông qua việc yêu cầu mạng chrome, multi-thread chế độ lát tải lên đã bắt đầu, sau khi kết thúc cuối cùng, bạn có thể xem tải. tóm lượcBài viết này chủ yếu giới thiệu chức năng tải lên tập tin, bao gồm cả chế độ upload bình thường và chế độ tải lên tập tin lát lớn, tập tin lớn lát upload chế độ dễ dàng để đổi mới hỗ trợ breakpoint và vượt qua thứ hai, theo dõi chức năng tập tin tối ưu hóa upload theo yêu cầu. demo bản demođịa chỉ trang web chính thức: https://crudapi.cn địa chỉ kiểm tra: https://demo.crudapi.cn/crudapi/login địa chỉ mã bổ sungđịa chỉ GitHubhttps://github.com/crudapi/crudapi-admin-web địa chỉ Giteehttps://gitee.com/crudapi/crudapi-admin-web Vì lý do mạng, GitHub có thể chậm, thay đổi truy cập Gitee, cập nhật đồng bộ hóa đang. Page 8Bản chất của chức năng ngôn ngữ này phụ thuộc vào chuỗi nguyên mẫu duy nhất JavaScript (prototype chain. Do đó, theo nghĩa nghiêm ngặt, JavaScript dựa trên ngôn ngữ định hướng nguyên mẫu.Đó là, mỗi đối tượng trường hợp có một nguyên mẫu.Đối tượng từ các thuộc tính và phương thức thừa kế nguyên mẫu này. 1, constructor Với hàm tạo, bạn chỉ cần tạo các đối tượng.Từ khóa this trong trình xây dựng trỏ đến chính đối tượng cá thể: function People(name){this.name = name;}Tạo một đối tượng cá thể bằng toán tử new và hàm tạo: var people = new People(' ming nhỏ.');console.log(people.name);.// Xiao Ming.Nhưng nếu hai trường hợp đã được tạo ra, các thuộc tính và phương pháp có thể không được chia sẻ trực tiếp giữa hai trường hợp này: var people1 = new People(' ming nhỏ');var people2 = new People(' Xiao Wang.');people1.sex = 'male';console.log(people2.sex); //undefinedNói cách khác, một khi đối tượng được khởi tạo, phương thức thuộc tính là độc lập và việc sửa đổi thuộc tính không ảnh hưởng đến các thể hiện khác. 2,Prototype Sau đó, có một thuộc tính prototype được tạo tự động khi tạo một đối tượng thể hiện.Bản thân nó là một đối tượng có các thuộc tính và phương thức có thể được chia sẻ giữa các phiên bản.Các thể hiện được bao gồm trong hàm tạo.Nói cách khác, các thuộc tính và phương pháp bên trong constructor có tính chất địa phương và các phương pháp sau instantiation, và các thuộc tính và phương pháp trong nguyên mẫu (prototype) chỉ là một tài liệu tham khảo trong ví dụ này, vì vậy chúng có thể được chia sẻ bởi nhiều trường hợp. Vẫn chỉ là hàm tạo, bây giờ thêm các thuộc tính prototype cho nó: People.prototype.sex = 'female';//Hoặc được viết vào People.prototype = {sex: 'female'};console.log(people1.sex); //maleconsole.log(people2.sex); //femaleTham số thuộc tính prototype của hàm tạo People ảnh hưởng trực tiếp đến hai phiên bản people1 và people2. Nhưng tại sao đầu ra people1.sex male?Điều này là do mối quan hệ nguyên mẫu tồn tại ở dạng đệ quy trong JavaScript.Nguyên mẫu của đối tượng cũng là một đối tượng và chính nguyên mẫu cũng có thể có một nguyên mẫu.Mức độ nguyên mẫu cao nhất là một đối tượng Object toàn cầu. Điều đó có nghĩa là, một khi people1.sex được đặt thành male, nó không thể được hiển thị trong nguyên mẫu.Nếu bản thân people1.sex không có giá trị, nó sẽ được đọc từ thuộc tính prototype của hàm tạo. Đẩy mức chính lên đến mức chính cho đến khi đối tượng Object. Lưu ý: Sử dụng "null" để gán một giá trị cho đối tượng, bạn có thể phá hủy các đối tượng tùy chỉnh, phát hành tài nguyên bộ nhớ. Page 9
Đôi khi chúng ta không muốn bong bóng hoặc mặc định, vì vậy bạn cần một số phương thức jQuery để ngăn chặn các sự kiện sủi bọt và mặc định. Bạn có thể thực hiện các mức độ phòng ngừa khác nhau của ba phương thức sau đây. A:return false --->In event handler ,prevents default behavior and event bubbing . return false có thể ngăn chặn các sự kiện mặc định và các sự kiện sủi bọt trong quá trình các sự kiện. B:event.preventDefault()---> In event handler ,prevent default event (allows bubbling) . event.preventDefault() có thể ngăn chặn các sự kiện mặc định trong quá trình các sự kiện, nhưng cho phép sự xuất hiện của sự kiện Bubbled. C:event.stopPropagation()---> In event handler ,prevent bubbling (allows default behavior). event.stopPropagation() có thể ngăn chặn sủi bọt nhưng cho phép nguyên nhân của sự kiện mặc định xảy ra trong quá trình xử lý. Page 10
Trước hết yếu tố này position là fixed top là giữa (clientHeight-elem.offsetHeight)/2(, đó là giữa trình duyệt, đây là cố định) left là chiều rộng cơ thể (clientWidht-) / 2 + Chiều rộng cơ thể + lề trái, khoảng cách trái có thể được đặt thành số dương hoặc số âm, nếu giá trị tuyệt đối của số âm bằng với chiều rộng cơ thể chính +elem.offsetWidht,, Yếu tố chỉ nổi ở phía bên trái của cơ thể chính trang. Khi được đặt thành 0, chỉ cần trôi ở bên phải của cơ thể chính của trang Tuy nhiên, Evil ie6 không hỗ trợ các thuộc tính J9RK9I trong css, để J18VG có thể được giải quyết bằng biểu thức expresion, tất cả đều tốt nhất Mã đọc cụ thể: |
