So legen Sie den Platzhalter-Eingabeaufforderungstext und den Schaltflächenauswahl-/Abbruchstatus im WeChat-Applet dynamisch fest

不言
Freigeben: 2018-06-23 14:25:16
Original
4695 Leute haben es durchsucht

In diesem Artikel wird hauptsächlich die Methode des WeChat-Applets zum dynamischen Festlegen von Platzhalter-Eingabeaufforderungstext und Schaltflächenauswahl-/Abbruchstatus vorgestellt, einschließlich der Ereignisbindung und der damit verbundenen Betriebsfähigkeiten zum dynamischen Festlegen von Attributdaten mit this.setData. Freunde in Not können sich auf Folgendes beziehen

Das Beispiel in diesem Artikel beschreibt die Methode des WeChat-Applets, um Platzhalter-Eingabeaufforderungstext und Schaltflächenauswahl- und Abbruchstatus dynamisch festzulegen. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

Rendering-Anzeige

Durch Bindung der Klickereignis-Platzhaltermethode , erhaltendata-num verwenden Sie js, um zu bestimmen, was num entspricht, und verwenden Sie dann den Ausdruck , um zu bestimmen, welches Tag ausgewählt ist (d. h. weißer Text auf blauem Hintergrund); class="{{num==X?'active':''}}"

js erhält

Datenschlüssel, legt den dynamischen Wert des Platzhalters im Eingabefeld fest

Inhalt in wxml:

<view class="retrieve-list">
  <p class="option">
    <span bindtap="placeholder" data-num=&#39;1&#39; data-key=&#39;&#39; data-val=&#39;&#39; class="{{num==1?&#39;active&#39;:&#39;&#39;}}">全部</span>
    <span bindtap="placeholder" data-num=&#39;2&#39; data-key=&#39;标题&#39; data-val=&#39;ti&#39; class="{{num==2?&#39;active&#39;:&#39;&#39;}}">标题</span>
    <span bindtap="placeholder" data-num=&#39;3&#39; data-key=&#39;摘要&#39; data-val=&#39;ab&#39; class="{{num==3?&#39;active&#39;:&#39;&#39;}}">摘要</span>
    <span bindtap="placeholder" data-num=&#39;4&#39; data-key=&#39;申请人&#39; data-val=&#39;ap&#39; class="{{num==4?&#39;active&#39;:&#39;&#39;}}">申请人</span>
    <span bindtap="placeholder" data-num=&#39;5&#39; data-key=&#39;申请号&#39; data-val=&#39;an&#39; class="{{num==5?&#39;active&#39;:&#39;&#39;}}">申请号</span>
    <span bindtap="placeholder" data-num=&#39;6&#39; data-key=&#39;代理人&#39; data-val=&#39;ag&#39; class="{{num==6?&#39;active&#39;:&#39;&#39;}}">代理人</span>
  </p>
  <p class="option">
    <span bindtap="placeholder" data-num=&#39;7&#39; data-key=&#39;代理机构&#39; data-val=&#39;ac&#39; class="{{num==7?&#39;active&#39;:&#39;&#39;}}">代理机构</span>
    <span bindtap="placeholder" data-num=&#39;8&#39; data-key=&#39;公开号&#39; data-val=&#39;pn&#39; class="{{num==8?&#39;active&#39;:&#39;&#39;}}">公开号</span>
    <span bindtap="placeholder" data-num=&#39;9&#39; data-key=&#39;发明人&#39; data-val=&#39;in&#39; class="{{num==9?&#39;active&#39;:&#39;&#39;}}">发明人</span>
    <span bindtap="placeholder" data-num=&#39;10&#39; data-key=&#39;专利权人&#39; data-val=&#39;pa&#39; class="{{num==10?&#39;active&#39;:&#39;&#39;}}">专利权人</span>
  </p>
</view>
Nach dem Login kopieren

Inhalt in js:

var app = getApp()
Page({
 data: {
  placeholder:&#39;请输入&#39;,
  ph:&#39;&#39;,
  num:1,
  key:&#39;&#39;,
 },
 placeholder:function(e){
  var num = e.currentTarget.dataset.num
  this.setData({
   ph: this.data.placeholder+e.currentTarget.dataset.key
  })
  this.setData({
   num: num
  })
})
Nach dem Login kopieren

Das Obige ist der gesamte Inhalt dieses Artikels Weitere verwandte Inhalte finden Sie im PHP Chinese Net!

Verwandte Empfehlungen:

Eine kurze Einführung in die Registerkarten im WeChat-Miniprogramm

Das WeChat-Miniprogramm implementiert das Klicken Schaltflächen zum Verschieben der Ansicht Beschriftungspositionsfunktion

WeChat-Applet realisiert die Funktion des Klickens auf die Schaltfläche zum Ändern der Schriftfarbe

Das obige ist der detaillierte Inhalt vonSo legen Sie den Platzhalter-Eingabeaufforderungstext und den Schaltflächenauswahl-/Abbruchstatus im WeChat-Applet dynamisch fest. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage