ホームページ ウェブフロントエンド jsチュートリアル JQuery はクリックしてフォローしたりアンフォローしたりする機能をどのように実現しますか

JQuery はクリックしてフォローしたりアンフォローしたりする機能をどのように実現しますか

Jul 24, 2017 pm 05:14 PM
jquery 焦点を当てる キャンセル

「同意」「愛」を意味するインターネット用語のようなもの。

このインターネットスラングは、オンラインコミュニティの「いいね!」機能から来ています。あなたが送受信する「いいね!」の数、「いいね!」を与えるときの好みなどは、あなたが誰であるか、あなたがどのような状態にあるかをある程度反映することができます。 「いいね!」の後ろにはあなたが映っています。これに対応するのがキャンセル機能です。たまたま、ブロガーは最近 APP に取り組んでいたのですが、そのセクションの 1 つで「いいね」機能とキャンセル機能を実装する必要があったため、考えた結果、JQuery コードを使用して実装することにしました。実践的な内容まで! !

まず、JQuery プラグインを導入する必要があります

JQuery はクリックしてフォローしたりアンフォローしたりする機能をどのように実現しますか

次に、div を定義し、いくつかのスタイルを与える必要があります

JQuery はクリックしてフォローしたりアンフォローしたりする機能をどのように実現しますか

JQuery はクリックしてフォローしたりアンフォローしたりする機能をどのように実現しますか

次に、JS コードがあります、以下に示すように

$(document).ready(function(){

var onOff=true;

var div=$(".div");

div.click(function(){

if (div.onOff) {

div.val("フォローしてください");

div.css({"background":'#ccc'});

div.onOff = false;

} else {

div.css( {"background":'red'});

div.val("フォロー中");

div.onOff = true;

}

});

});

実装効果は以下の通りです

JQuery はクリックしてフォローしたりアンフォローしたりする機能をどのように実現しますか

同様に、画像切り替え効果も以下のように実現できることが分かります

JQuery はクリックしてフォローしたりアンフォローしたりする機能をどのように実現しますか

実装コードは以下の通りです

html:

css: 画像パスに注意してください

.div{

使用の使用 - 介して - - 40px;

varming = true;

var div=$(".div");

div.click(function(){

if (div.onOff) {

div.css({"background-image": 'url(img/guanzhu。png)'});

div.onoff = false;

以上がJQuery はクリックしてフォローしたりアンフォローしたりする機能をどのように実現しますかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

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

AI Clothes Remover

AI Clothes Remover

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

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

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

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

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

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

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

Meituanでの注文をキャンセルする方法 Meituanでの注文をキャンセルする方法 Mar 07, 2024 pm 05:58 PM

Meituan を使用して注文する場合、ユーザーは希望しない注文をキャンセルすることができます。多くのユーザーは Meituan の注文をキャンセルする方法がわかりません。ユーザーは、マイ ページをクリックして受け取りたい注文を入力し、受け取りが必要な注文を選択します。キャンセルする場合は、「キャンセル」をクリックします。 Meituanの注文をキャンセルする方法 1. まず、Meituanのマイページをクリックして、受け取る注文を入力します。 2. 次に、キャンセルする必要がある注文をクリックして入力します。 3. 「注文をキャンセル」をクリックします。 4. [OK] をクリックして注文をキャンセルします。 5. 最後に、個人の状況に応じてキャンセルの理由を選択し、[送信] をクリックします。

WeChat で耳マークをキャンセルする詳細な手順 WeChat で耳マークをキャンセルする詳細な手順 Mar 25, 2024 pm 05:01 PM

1. 耳のマークは音声受信モードです まず、WeChat を開きます。 2. 右下隅の「私」をクリックします。 3. 「設定」をクリックします。 4. チャットを見つけてクリックして入力します。 5. イヤホンを使用して音声を再生するのチェックを外します。

Mango TVの自動更新はどこでキャンセルできますか? Mango TVの自動更新はどこでキャンセルできますか? Feb 28, 2024 pm 10:16 PM

多くのユーザーは、ビデオ ソフトウェアである Mango TV を体験すると、より多くの映画やテレビのリソース、より包括的なサービスを楽しむためにメンバーになることを選択します。 Mango TV メンバーシップ サービスを使用する過程で、ユーザーの中には、エキサイティングなコンテンツを見逃さないように割引を享受するために自動更新機能をオンにすることを選択する人もいます。ただし、ユーザーが会員サービスが必要なくなった場合や、支払い方法を変更したい場合、財産の安全を守るために、自動更新機能を解除することは非常に重要なことです。詳細については、この記事をフォローしてください。 Mango TVの会員自動更新をキャンセルするにはどうすればよいですか? 1. まず、Mango TV モバイル APP に [My] と入力し、[VIP メンバーシップ] を選択します。 2. 次に [チューブ] を見つけます。

WeChatでの購読料の支払いをキャンセルするための操作手順 WeChatでの購読料の支払いをキャンセルするための操作手順 Mar 26, 2024 pm 08:21 PM

1. 電話機の設定で [iTunesStore と AppStore] オプションをクリックします。 2. [AppleIDを表示]をクリックし、ログインパスワードを入力します。 3. [アカウント設定]インターフェイスに入り、[支払い情報]をクリックします。 4. 支払い方法を[なし]にチェックし、[完了]をクリックします。完了後、WeChat インターフェースに戻ると、[キャンセル成功の通知] メッセージが表示され、WeChat での料金の自動引き落としは行われなくなります。

Weibo で私の注意が他の人に気づかれないのはなぜですか? -Weiboの訪問者記録を確認するにはどうすればよいですか? Weibo で私の注意が他の人に気づかれないのはなぜですか? -Weiboの訪問者記録を確認するにはどうすればよいですか? Mar 18, 2024 am 11:22 AM

Weibo で私の注意が他の人に気づかれないのはなぜですか?他の人にフォローしていることが分からないように、ブロガーを「静かにフォローする」グループに分類するだけです。 1. 携帯電話で Weibo を開き、ホームページの [フォロー] をクリックします。 2.「マイグループ」の[静かにフォローする]をクリックします。 Weibo の訪問者記録を確認するにはどうすればよいですか? 1. Weibo でテストされている訪問者記録機能は、現在 SVIP と VVIP のみに公開されており、一部のユーザーのみに公開されています。 2. ユーザーはパーソナルセンターの下の[その他の機能]に訪問者記録の入り口があり、訪問者数、訪問者、およびより頻繁に訪問する人々を確認できます。 3. 本機能はSVIPおよびVVIPユーザーのみが利用できる機能であり、一般ユーザーおよび一般会員ユーザーは一時的に利用できなくなります。 4. つまり、Weibo テスト訪問者

Alipayの顔認証決済をキャンセルするにはどうすればよいですか? Alipay の顔認証支払いのキャンセルに関するチュートリアル Alipayの顔認証決済をキャンセルするにはどうすればよいですか? Alipay の顔認証支払いのキャンセルに関するチュートリアル Mar 16, 2024 pm 03:07 PM

Alipay は非常に実用的なライフ サービス プラットフォームであり、このソフトウェアは非常に強力で、生命支払い、旅行、医療保険などの機能をユーザーに提供し、すべての人の生活に利便性をもたらします。 Alipay プラットフォームには、誰もがロックを解除するのを待っている多くの機能がありますが、Alipay で顔スワイプ支払いをキャンセルするにはどうすればよいですか? Alipay で顔スワイプ支払いをキャンセルするための詳細なチュートリアル: 1. まず Alipay を開きます 2. 右下隅の [My] をクリックします3. 右上隅の [設定] をクリックします。 4. 支払い設定をクリックします。 5. 生体認証支払いをクリックします。 6. 支払いのために顔をスキャンする携帯電話を見つけます。 7. ソフトウェア機能のチェックを外します。 1. さまざまなシーンの関係、グループ チャット、およびグループ払いがさらに便利に; 2. お子様と保護者のための家族口座を開設; 3. 長距離銀行間送金とクレジットカード返済が無料

Doudian で 48 時間以内に配送をキャンセルするにはどうすればよいですか?配達が遅れた場合、異議を申し立てることはできますか? Doudian で 48 時間以内に配送をキャンセルするにはどうすればよいですか?配達が遅れた場合、異議を申し立てることはできますか? Mar 07, 2024 pm 01:20 PM

中国で有名なショートビデオ電子商取引プラットフォームとして、Doudian は販売者に便利な販売チャネルと幅広いユーザー ベースを提供します。 Doudian では、販売者はユーザーのショッピング ニーズを満たすために商品を時間内に配送する必要がありますが、さまざまな理由により、販売者は 48 時間以内に出荷をキャンセルする必要がある場合があります。では、Dudian はどのようにして 48 時間以内に出荷をキャンセルするのでしょうか? 1. Doudian で 48 時間以内に配送をキャンセルするにはどうすればよいですか?販売者は Doudian のバックエンド管理システムで出荷をキャンセルできます。バックエンド管理システムにログインした後、販売者はキャンセルする必要がある注文を簡単に見つけて、対応する注文を選択して操作することができます。 「配送をキャンセル」ボタンをクリックすると、キャンセルを確認するメッセージが表示され、販売者が確認した後、注文は正常にキャンセルされます。この操作は 48 時間以内に発送された注文に適用されます

Fliggy Travel の安心遅延ギフト パッケージをキャンセルするにはどうすればよいですか? 安心遅延ギフト パッケージの購入を回避するにはどうすればよいですか? Fliggy Travel の安心遅延ギフト パッケージをキャンセルするにはどうすればよいですか? 安心遅延ギフト パッケージの購入を回避するにはどうすればよいですか? Mar 12, 2024 pm 05:30 PM

Fliggy Travel は、誰でも簡単にオンラインでチケットを購入でき、誰でもとても便利です。使い方はとても簡単です。さまざまな旅行方法が用意されており、ホテルの予約もできます。すべての旅行は事前にここで行うことができます。すべての準備をして、そして、すべての旅行体験はとても良いです。多くの人がここで航空券を購入しますが、毎回費用がかかることに気づくでしょう。これは遅延のないギフトパッケージです。このギフトパッケージの機能は、フライトが遅延した後、時間がかかりますので、補償はいたしますが、遅延がなければ、このサービスはまったく役に立ちません。現代社会では、遅延は比較的小さいため、通常は役に立ちません。ここでは、編集者があなたに提供します購入キャンセル不可サービス 購入したくない場合は、梱包方法を確認してください。

See all articles