ホームページ WeChat アプレット ミニプログラム開発 ミニ プログラム: クリック カウントダウンを実装するコード

ミニ プログラム: クリック カウントダウンを実装するコード

Aug 10, 2018 pm 03:44 PM
秒読み

この記事の内容はミニプログラムに関するものです。クリックカウントダウンを実装するコードは、必要な場合に参考にしていただければ幸いです。

var interval = null //倒计时函数
Page({
  data: {
    date:'请选择日期',
    fun_id:2,
    time: '获取验证码', //倒计时 
    currentTime:61
  }, 
  getCode: function (options){
    var that = this;
    var currentTime = that.data.currentTime
    interval = setInterval(function () {
      currentTime--;
      that.setData({
        time: currentTime+'秒'
      })
      if (currentTime <= 0) {
        clearInterval(interval)
        that.setData({
          time: &#39;重新发送&#39;,
          currentTime:61,
          disabled: false   
        })
      }
    }, 100)  
  },
  getVerificationCode(){
    this.getCode();
    var that = this
    that.setData({
      disabled:true
    })
  },

})
ログイン後にコピー
<button disabled=&#39;{{disabled}}&#39; data-id="2" bindtap="getVerificationCode">
{{time}}
</button>
ログイン後にコピー

関連する推奨事項:

ミニ プログラム コンポーネント: チャット セッション コンポーネントの概要 (コード付き)

ミニ プログラムとバックグラウンド間の対話の実装 (コード付き)

以上がミニ プログラム: クリック カウントダウンを実装するコードの詳細内容です。詳細については、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)

C++ で簡単なカウントダウン プログラムを作成するにはどうすればよいですか? C++ で簡単なカウントダウン プログラムを作成するにはどうすればよいですか? Nov 03, 2023 pm 01:39 PM

C++ は広く使用されているプログラミング言語で、カウントダウン プログラムを作成するのに非常に便利で実用的です。カウントダウン プログラムは、非常に正確な時間計算とカウントダウン機能を提供する一般的なアプリケーションです。この記事では、C++ を使用して簡単なカウントダウン プログラムを作成する方法を紹介します。カウントダウン プログラムを実装する鍵は、タイマーを使用して時間の経過を計算することです。 C++ では、time.h ヘッダー ファイル内の関数を使用してタイマー関数を実装できます。以下は、単純なカウントダウン プログラムのコードです。

Vue を使用してボタンのカウントダウン効果を実装する方法 Vue を使用してボタンのカウントダウン効果を実装する方法 Sep 21, 2023 pm 02:03 PM

Vue を使用してボタンのカウントダウン効果を実装する方法 Web アプリケーションの人気が高まるにつれて、ユーザーがページを操作するときのユーザー エクスペリエンスを向上させるために、動的効果を使用する必要がよくあります。その中でもボタンのカウントダウンエフェクトは非常に一般的で実用的なエフェクトです。この記事では、Vue フレームワークを使用してボタンのカウントダウン効果を実装する方法と、具体的なコード例を紹介します。まず、ボタンとカウントダウン関数を含む Vue コンポーネントを作成する必要があります。 Vue では、コンポーネントは再利用可能な Vue インスタンスであり、ビューは

Win10 起動時の 10 秒カウントダウンをキャンセルするには? Win10 起動時のカウントダウンをキャンセルする 3 つの方法 Win10 起動時の 10 秒カウントダウンをキャンセルするには? Win10 起動時のカウントダウンをキャンセルする 3 つの方法 Feb 29, 2024 pm 07:25 PM

win10 では、起動カウントダウンがデフォルトで有効になっています。コンピューターの電源を入れると、カウントダウン インターフェイスが表示されます (通常は 10 秒のカウントダウン)。この時間内に、起動を続行するか、他の操作を実行するかを選択できます。起動カウントダウンはシステムにある程度の利便性をもたらしますが、場合によっては問題を引き起こす可能性もあります。表示を解除したいけどやり方がわからない この記事では、Win10起動後の数秒のカウントダウンを解除する方法を紹介します。 win10 の起動カウントダウンについて理解する win10 では、起動カウントダウンがデフォルトで有効になっています。コンピューターの電源を入れると、カウントダウン インターフェイスが表示されます (通常は 10 秒のカウントダウン)。この時間内に、起動を続行するか続行するかを選択できます。

CSS を使用してカウントダウン効果を作成する方法 CSS を使用してカウントダウン効果を作成する方法 Oct 26, 2023 am 10:36 AM

CSS を使用してカウントダウン効果を作成する方法. カウントダウン効果は Web 開発では一般的な機能であり、ユーザーにカウントダウンの動的な効果を提供し、緊迫感と期待感を与えることができます。この記事では、CSS を使用してカウントダウン効果を実現する方法を紹介し、詳細な実装手順とコード例を示します。実装手順は次のとおりです。 ステップ 1: HTML 構造の構築 まず、カウントダウン コンテンツをラップするための div コンテナを HTML で作成します。例: &lt;divclass="countd

JavaScript に基づいた Web カウントダウン アプリケーションの開発 JavaScript に基づいた Web カウントダウン アプリケーションの開発 Aug 08, 2023 am 09:55 AM

JavaScript に基づいた Web カウントダウン アプリケーションの開発 インターネットの発展に伴い、Web アプリケーションは私たちの生活の中でますます重要な役割を果たしています。中でもカウントダウンアプリは一般的な機能であり、様々な場面で広く利用されています。この記事では、JavaScript を使用して単純な Web カウントダウン アプリケーションを開発する方法を紹介し、対応するコード例を添付します。 1. HTML 構造を作成する まず、Web カウントダウン アプリケーションの基本構造を構築するための HTML ファイルを作成する必要があります。 &lt 文書内

uniappでタイマーを使用してページカウントダウン効果を実現する方法 uniappでタイマーを使用してページカウントダウン効果を実現する方法 Oct 18, 2023 am 11:18 AM

Uniapp は、アプレット、H5、Android、iOS など、さまざまな種類のアプリケーションの開発に使用できるクロスプラットフォーム開発フレームワークです。 Uniapp では、タイマーを使用してページのカウントダウン効果を実現できます。タイマーは時間間隔を設定し、各時間間隔内で指定されたコードを実行して、ページ カウントダウン効果を実現できます。以下は、タイマーを使用してページカウントダウン効果を実現する方法を示す例です。まず、カウントダウンを表示する必要があるページの .vue ファイルに次のコードを追加します。

Vue を使用して検証コードのカウントダウン効果を実装する方法 Vue を使用して検証コードのカウントダウン効果を実装する方法 Sep 19, 2023 am 11:36 AM

Vue を使用して検証コードのカウントダウン効果を実装する方法 インターネットの発展に伴い、検証コードはユーザーのセキュリティを保護する重要な手段の 1 つになりました。ユーザー エクスペリエンスを向上させるために、カウントダウン効果を使用して、確認コードを取得するまでの残り時間をユーザーに思い出させることができます。この記事では、Vue を使用して検証コードのカウントダウンの特殊効果を実装する方法と、具体的なコード例を紹介します。まず、検証コードのカウントダウン機能を実装するための Vue コンポーネントを作成する必要があります。このコンポーネントでは、残りの秒数を保存するカウントダウン時間変数を定義できます。

uniappでカウントダウンと目覚まし時計機能を実装する方法 uniappでカウントダウンと目覚まし時計機能を実装する方法 Oct 20, 2023 pm 06:36 PM

uniapp でカウントダウンと目覚まし時計機能を実装する方法 1. カウントダウン関数の実装: カウントダウン関数は実際の開発で非常に一般的であり、検証コード カウントダウン、フラッシュ セール カウントダウンなど、さまざまなカウントダウン関数を実装するために使用できます。以下では、uniapp フレームワークを使用してカウントダウン機能を実装する方法を紹介します。 uniapp プロジェクトにカウントダウン コンポーネントを作成します。Countdown.vue という名前を付けることができます。 Countdown.vue では、カウントダウン変数とタイマー フラグを定義できます。

See all articles