jQuery :image 選擇器

jQuery 中的:image 選擇器用於選擇所有型別為“image”的 input 元素。

HTML 中的<input type="image"> 元素是一個 input 元素，它充當提交按鈕，但它顯示影像而不是常規按鈕。

語法

以下是 jQuery 中 :image 選擇器的語法：

$(":image")

引數

以下是此方法的引數：

“:image” − 此選擇器選擇所有型別為 image 的 <input> 元素。

示例 1

在下面的示例中，我們使用 :image 選擇器為所有影像輸入元素應用藍色邊框：

<html>
<head>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script>
        $(document).ready(function(){
            $(":image").css("border", "3px solid blue");
        });
    </script>
</head>
<body>
    <form>
        <input type="image" src="https://tutorialspoint.tw/cg/images/logo.png" alt="Submit Button">
    </form>
</body>
</html>

執行上述程式後，影像將以藍色實線邊框突出顯示。

示例 2

在這個例子中，我們使用 :image 選擇器向影像輸入元素新增一個點選事件處理程式：

<html>
<head>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script>
        $(document).ready(function(){
            $(":image").click(function(){
                alert("Image input clicked!");
            });
        });
    </script>
</head>
<body>
    <form>
        <input type="image" src="https://tutorialspoint.tw/cg/images/logo.png" alt="Submit Button">
    </form>
</body>
</html>

當我們點選影像時，螢幕上將顯示一個警報，顯示“已點選影像輸入”。

jquery_ref_selectors.htm

列印頁面