Phương thức jQuery hasClass (): Kiểm tra xem lớp có hiện diện không – kiểm tra jquery cho lớp

Phương thức jQuery hasClass () kiểm tra xem tên lớp được chỉ định có tồn tại trong các phần tử được chọn hay không. Nó trả về giá trị ‘true’ khi tìm thấy

Bạn đang xem: kiểm tra jquery cho lớp

Phương thức jQuery hasClass () kiểm tra xem tên lớp được chỉ định hay không tồn tại trong các phần tử đã chọn. Nó trả về giá trị ‘true’ khi nó tìm thấy lớp được chỉ định có mặt. Bạn sẽ nhận được “false” nếu lớp không có trong phần tử.

Cú pháp

Cú pháp của phương thức này được đưa ra dưới đây: –

Kiểm tra xem một lớp có tồn tại hay không

$ (bộ chọn) .hasClass (className)

Mô tả các thông số

Mô tả các thông số được đưa ra bên dưới.

Tên thông số
Sự mô tả

bộ chọn
Bộ chọn là trường bắt buộc được sử dụng để chọn các phần tử. Bạn phải sử dụng tên thẻ, tên lớp hoặc id của các phần tử để chọn.

tên lớp
Chỉ định tên lớp để kiểm tra xem có xuất hiện trong phần tử đã chọn hay không.

Phương thức jQuery hasClass () để kiểm tra xem lớp có tồn tại hay không

Khi bạn phải kiểm tra sự tồn tại của tên lớp trong phần tử, bạn phải sử dụng phương pháp này. Nếu bạn muốn thêm tên lớp vào phần tử, trước tiên bạn phải kiểm tra xem nó đã có trong phần tử chưa.

Ví dụ

Kiểm tra trực tiếp

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

& lt; script & gt;

$

(

tài liệu

)

.

sẵn sàng

(

chức năng

(

)

{

$

(

‘. myhasclassbtn’

)

.

nhấp vào

(

hàm

(

)

{

< / p>

var

myclass

=

$

(

“p”

)

.

hasClass

(

” mypara “

)

;

alert

(

myclass

)

;

}

)

;

}

)

;

& lt; / script & gt;

& lt; style & gt;

. mypara

{

padding

:

10px

;

border

:

1px

rắn

# ccc

;

}

& lt; / style & gt;

< p class = "crayon-h"> & lt;

p

& gt;

Xem Thêm  Kiểu phông chữ HTML - Cách thay đổi màu và kích thước văn bản bằng thẻ HTML - kích thước văn bản kiểu html

Nhấp vào

bên dưới

nút

để

kiểm tra

nếu

class

name

‘mypara’

tồn tại

hoặc

không

.

& lt;

/

p

& gt;

& lt;

nút

loại

=

“nút”

class

=

” myhasclassbtn “

& gt;

Nhấp vào

để

Kiểm tra

Lớp

& lt;

/

nút

< p class = "crayon-h"> & gt;

& lt;

br

& gt;

& lt;

br

& gt;

& lt;

p

lớp

=

” mypara “

& gt;

Đây

đoạn văn

của tôi

& lt;

/

p

& gt;

Đầu ra

Nhấp vào nút bên dưới để kiểm tra xem tên lớp ‘mypara’ có tồn tại hay không.

Đây là đoạn văn của tôi

Bạn phải nhấp vào nút ở trên để nhận kết quả trong hộp cảnh báo. Ví dụ cho thấy rằng lớp được chỉ định hiện diện trong phần tử được chọn. Sau khi tìm thấy sự tồn tại của tên lớp, bạn có thể thêm một lớp khác bằng phương thức jQuery addClass ().

Bạn cũng có thể thích đọc

Tôi hy vọng bạn thích hướng dẫn này về phương thức jQuery hasClass (). Nếu bạn có bất kỳ thắc mắc nào liên quan đến hướng dẫn, vui lòng bình luận bên dưới.

Tài liệu tham khảo


Xem thêm những thông tin liên quan đến chủ đề kiểm tra jquery cho lớp

jQuery Resizable Widget

  • Tác giả: kudvenkat
  • Ngày đăng: 2015-07-20
  • Đánh giá: 4 ⭐ ( 5246 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Link for all dot net and sql server video tutorial playlists
    https://www.youtube.com/user/kudvenkat/playlists?sort=dd&view=1

    Link for slides, code samples and text version of the video
    http://csharp-video-tutorials.blogspot.com/2015/07/jquery-resizable-widget.html

    Healthy diet is very important both for the body and mind. If you like Aarvi Kitchen recipes, please support by sharing, subscribing and liking our YouTube channel. Hope you can help.
    https://www.youtube.com/channel/UC7sEwIXM_YfAMyonQCrGfWA/?sub_confirmation=1

    In this video we will discuss jQuery Resizable Widget

    jQuery Resizable Widget allows you to change the size of an element using the mouse

    Consider the following HTML and CSS

    <div id=”redDiv” class=”divClass” style=”background-color: red”>
    Red Div
    </div>

    <style>
    .divClass {
    font-family: Arial;
    height: 150px;
    width: 150px;
    text-align: center;
    color:white
    }
    </style>

    To make the div element resizable
    $(document).ready(function () {
    $(‘redDiv’).resizable();
    });

    jQuery Resizable Widget Options

    alsoResize – Allows to resize one or more elements synchronously with the resizable element
    animate – Animates to the final size after resizing. Include .ui-resizable-helper class to display outline while resizing
    aspectRatio – Specifies whether the element should preserve aspect ratio
    autoHide – Specifies whether the resize handles should hide when the user is not hovering over the element
    containment – Constrains resizing to within the bounds of the specified element or region
    ghost – specifies whether a semi-transparent helper element should be shown for resizing
    maxHeight – The maximum height you can resize to
    minHeight – The minimum height you can resize to
    maxWidth – The maximum width you can resize to
    minWidth – The minimum width you can resize to

    jQuery Resizable Widget Events
    start – Triggered at the start of a resize operation
    stop – Triggered at the end of a resize operation
    resize – Triggered during the resize operation

    Resizing redDiv will also resize blueDiv

    HTML
    <div id=”redDiv” class=”divClass” style=”background-color: red”>
    Red Div
    </div>
    <br />
    <div id=”blueDiv” class=”divClass” style=”background-color: blue”>
    Red Div
    </div>

    jQuery
    $(document).ready(function () {
    $(‘redDiv’).resizable({
    alsoResize:’blueDiv’
    });
    });

    Constrains resizing to within the bounds of the container div

    HTML
    <div id=”container” style=”border: 3px solid black; height: 300px; width: 300px; padding:5px”>
    <div id=”redDiv” class=”divClass” style=”background-color: red”>
    Red Div
    </div>
    </div>

    jQuery
    $(‘redDiv’).resizable({
    containment: ‘container’
    });

Bài tập & hướng dẫn

  • Tác giả: hocwebchuan.com
  • Đánh giá: 4 ⭐ ( 8284 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Bài tập có gợi ý và hướng dẫn giải liên quan các chủ đề: html5, css3, jquery, javascript, wordpress, php, …

Làm cách nào để kiểm tra với jQuery nếu có bất kỳ biểu mẫu nào được gửi?

  • Tác giả: vi.uwenku.com
  • Đánh giá: 3 ⭐ ( 9206 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Tôi có một trang có nhiều biểu mẫu và người dùng sẽ chọn thứ gì đó trên trang đó. Khi người dùng thực hiện, tôi cần đặt yếu tố đó ở nơi khác, giống như một giỏ hàng thực sự. Nhưng tôi dường như không

jQuery: Kiểm tra xem div có tên lớp nhất định tồn tại không

  • Tác giả: qastack.vn
  • Đánh giá: 4 ⭐ ( 8357 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: [Tìm thấy giải pháp!] Bạn có thể đơn giản hóa điều này bằng cách kiểm tra đối tượng đầu tiên…

Bộ nạp lớp và kiểm tra Byte code

  • Tác giả: hktsoft.com
  • Đánh giá: 3 ⭐ ( 2013 lượt đánh giá )
  • Khớp với kết quả tìm kiếm:

Có được kiểm tra hay không trong jQuery?

  • Tác giả: presbyteryofstockton.org
  • Đánh giá: 3 ⭐ ( 3031 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Phương thức prop () và is () là hai cách mà chúng ta có thể kiểm tra xem hộp kiểm có được chọn trong jQuery hay không. prop (): Phương thức này cung cấp một cách đơn giản để theo dõi trạng thái của các hộp kiểm. Nó hoạt động tốt trong mọi điều kiện vì mọi hộp kiểm đều có thuộc tính đã kiểm tra chỉ định trạng thái đã kiểm tra hoặc không kiểm tra của nó.

Học jQuery cơ bản và nâng cao

  • Tác giả: vietjack.com
  • Đánh giá: 4 ⭐ ( 7727 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Học jQuery cơ bản và nâng cao -Tự Học lập trình jQuery cơ bản và nâng cao theo các bước đơn giản về jQuery Selector, Bộ chọn, thuộc tính, Attribute, CSS, Thao tác DOM, Truy cập DOM, AJAX trong jQuery, hiệu ứng, sự kiện trong jQuery, Drag và Drop, Effect, Event Handler, UI, Plug-ins và các tiện ích khác trong jQuery.

Xem thêm các bài viết khác thuộc chuyên mục: Kiến thức lập trình

Xem Thêm  Cách học cách phát triển web bằng tài nguyên miễn phí - học phát triển web cơ bản