Phím tắt Chrome để tạm dừng thực thi tập lệnh


48

Có một phím tắt trong Google Chrome sẽ phá vỡ việc thực thi tập lệnh không? (Tương đương với việc nhấn nút ||"Tạm dừng thực thi tập lệnh" trong bảng Tập lệnh Công cụ dành cho nhà phát triển.)

Tôi muốn sử dụng Công cụ Dev để kiểm tra một phần tử ở trạng thái di chuột; các mouseleaveđang rõ ràng sẽ chạy nếu tôi cố gắng thực sự nhấp nút tạm dừng!

Câu trả lời:


56

Trong khi tôi chưa tìm được giải pháp chính xác cho vấn đề này, tôi đã tìm ra một lớp lót có thể được đặt trong một trang (hoặc dán trong bảng điều khiển Javascript) để đạt được mục tiêu của mình:

jQuery(window).keydown(function(e) { if (e.keyCode == 123) debugger; });

Điều này sẽ khiến việc thực thi bị tạm dừng khi bạn nhấn F12.

( debuggerlà một câu lệnh JavaScript buộc một điểm dừng.)


Cập nhật: Dev Tools có nhiều phím tắt tích hợp (nhấn F1cho danh sách), nhưng bạn phải tập trung trong cửa sổ Dev Tools để chúng hoạt động. Tạm dừng thực thi tập lệnh là F8(khi nhìn vào tab Nguồn, kể từ Chrome 45) hoặc Ctrl+ /.

Một lớp lót ở trên vẫn có thể hữu ích nếu bạn cần tập trung vào trang trước khi tạm dừng.


6
F8 chỉ hoạt động khi bạn ở trên trang "Nguồn" trong DevTools (Chrome 40)
netvope

1
CTRL + / có hoạt động trong Linux hay không? Bởi vì CTRL + \ dường như hoạt động trong Windows và theo những người khác, nó sẽ là CMD + \ cho MAC.
djabraham

1
Hiệu ứng tương tự nhưng không yêu cầu jQuery:window.addEventListener('keydown', e => { if (e.keyCode === 123) debugger })
pau.moreno

đôi khi các phím nóng sự kiện đóng phần tử bạn muốn kiểm tra, setTimeout(function() { debugger; }, 1000)giúp đỡ ở đây
cyptus

14

Phím tắt của Google Danh sách tham khảo cho "Tạm dừng / tiếp tục thực thi tập lệnh":

  • F8hoặc Ctrl+ \(Windows)
  • F8hoặc Cmd+ \(Mac)

Có nhiều cách dễ dàng hơn để kiểm tra mọi thứ trong trạng thái kỳ lạ như di chuột hoặc hoạt động. Đầu tiên, tìm nút DOM trong ngăn Thành phần của Công cụ phát triển Chrome. Bây giờ bạn có thể nhấp chuột phải vào nút và xem "Trạng thái phần tử lực" trong menu ngữ cảnh hoặc chọn nút và tìm trong tab Kiểu và tìm biểu tượng con trỏ hộp-nét-bằng-chuột-ở trên cùng bên phải (bên cạnh biểu tượng + / plus cho phép bạn thêm quy tắc CSS mới element.stylevào phần tử bạn đã chọn).

Khi bạn kích hoạt một trong những trạng thái này, lề trái của ngăn phần tử sẽ có một vòng tròn nhỏ để cho biết rằng bạn đã ghi đè trạng thái tự nhiên của phần tử trên dòng đó.


3
F8 không hoạt động trong cửa sổ trình duyệt chính, chỉ trong cửa sổ Dev Tools. Sử dụng Force Element State không giúp ích gì khi tập lệnh nghe các sự kiện (thay vì chỉ CSS) đang thực hiện.
josh3736

3
F8 không hoạt động trong cửa sổ trình duyệt chính nhưng bạn phải mở cửa sổ Dev Tools cho tab Nguồn trong nền.
reor

8

Tôi đã viết một Tiện ích mở rộng Chrome nhỏ cho phép bạn nhấn nút Tạm dừng trên bàn phím để tạm dừng thực thi javascript

Làm thế nào để có được nó:

Sử dụng:

  1. Giữ công cụ phát triển chrome mở
  2. Nhấn pause/breaktrên bàn phím của bạn

1
@Flu, tôi đã thêm nó vào Cửa hàng Chrome trực tuyến. Thưởng thức
Phụ tùng

Điều này hoạt động rất tốt - tôi đã có thể tạm dừng để tôi có thể kiểm tra HTML một cách linh hoạt vào trang. Sử dụng Công cụ dành cho nhà phát triển không hoạt động vì HTML đã bị xóa bởi mã khi mất tập trung.
Kenny Evitt

Bàn phím của tôi không có nút "Tạm dừng / ngắt", vì vậy tôi phải ánh xạ nó sang một phím khác. Điều không rõ ràng ngay lập tức với tôi là bạn cần phải giữ tổ hợp phím mới KHI bạn nhấp vào nút "Lưu Combo".
Jasper Citi

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.