小程序 实现 按下不同按钮时 使不同的文字显示在文本框中?

在小程序 中 实现如 图片中的功能,

    ![图片说明](https://img-ask.csdn.net/upload/201811/15/1542252426_405689.png)
1

1个回答


<block wx:for="{{items}}">
   <view bindtap="click" data-index="{{index}}" data-text="{{item}}" style="border:solid 1px {{index==selectedIndex?'orange':'#666'}};width:45%;float:left;text-align:center;line-height:30px;margin:5px">{{item}}</view>
</block>
<textarea value="{{selectedText}}" style="clear:both;border:solid 1px #ccc"></textarea>


// demo.js
Page({
  data: {
    items: ['好啊好1', '好啊好2', '好啊好3','好啊好4'],
     selectedIndex:-1,
     selectedText:''
  },
  onLoad: function (options) {
  },
  click:function(e){
    var ds = e.target.dataset,index=ds.index,text=ds.text;
    this.setData({selectedIndex:index,selectedText:text})
  }
})
4
caozhy
贵阳挖掘机马善福,自备车辆专业挖游泳池 这个可以说回答得很正确了。lz建议你点下回答左上角的采纳和向上的箭头。
9 个月之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
Java代码 创建有一个文本框和三个按钮的小程序
创建有一个文本框和三个按钮的小程序。当按下每个按钮时,使不同的文字显示在文本框中
JAVA文本框、文本区和布局的设计
应用面向对象程序设计课程中的“封装和继承”的基本原理,本课程中“类、对象和接口”的基本概念、以及“Java的事件处理机制”、“图形用户界面设计”技术,当在文本区中输入若干数时,下面的文本框同时对输入的数进行求和运算并求出平均数。即随着输入的变化,文本框不断更新求和及平均值。
Qt学习之 pushButton和text&lineEdit(按钮按下显示内容)
一、按钮一按下,就会在text文本框中显示指定内容 1、ui界面布局 2、mydialog.h中添加槽函数 public slots: void myDynamicOutput(); 3、(1)mydialog.cpp中的构造函数中加入连接函数connect(ui-&gt;pushButton, SIGNAL(clicked()), this, SLOT(myDynamicOutput...
C#按钮效果
自制按钮:按钮按下时的不同效果,当鼠标经过、按下、双击时显示的不同效果图
js里关于连续点击按钮出现不同文字的方法
作为一个蒟蒻,看着别人写出点击按钮就可以变换按钮里的文字的操作,自己也想试试。 然后就发现了在js里不同于其他语言的一个地方。 js中好像不用写递归调用方法,如果你在一个数组里写了一个变量,那一定是等到条件限制这个变量不能变了,它才会自动结束变化。 我说的可能有些不明确。那直接先上代码。 &amp;amp;lt;!DOCTYPE html&amp;amp;gt; &amp;amp;lt;head&amp;amp;gt;&amp;amp;lt;link href=&amp;quot;ml...
MFC捕捉按钮按下松开消息小例程
MFC捕捉按钮按下松开消息小例程,获取按钮按下时和松开时不同的消息,在编辑框中显示不同的内容。
点击按钮出现文本
on(release){ var k:Boolean; if(k){ 在空中._visible=0; }else{ 在空中._visible=1; } k=!k; }
C#-----位运算---求16进制中1的个数
using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; using System.Drawing; using System.Linq; using System.Text; using System.Windows.Forms; name
小程序——点击按钮,样式不一样
&amp;lt;view class='shuliang'&amp;gt; &amp;lt;view class='shuliang_p'&amp;gt;购买数量&amp;lt;/view&amp;gt; &amp;lt;view class='wrap'&amp;gt; &amp;lt;view class='ping {{amoutIndex==1?&quot;shu&quot;:&quot;&quot;}}' bindtap='buy' id='1'&amp;gt;30瓶&amp;lt;/v
编写程序,包括一个标签、一个文本框和一个按钮,当用户单击按钮时,程序把文本框中的内容复制到标签中。
实现,从键盘输入点击’Copy按钮’输出。 import java.awt.*; import java.awt.event.*; import java.util.*; public class lyy extends Frame implements ActionListener { private Button copy = new Button(&quot;Copy&quot;); pr...
微信小程序-点击按钮内容显示和隐藏,并且文字改变
wxml: &amp;lt;!--按钮--&amp;gt; &amp;lt;view class=&quot;more&quot; bindtap=&quot;showedit&quot;&amp;gt;{{editText}}&amp;lt;/view&amp;gt; &amp;lt;!--内容--&amp;gt; &amp;lt;view class=&quot;delete {{editTrue?'isRuleShow':'isRuleHide'}}&quot;&amp;gt; &amp
详解微信小程序文本框(label/input)、按钮(button)用法,以登陆界面为例
一个很简单的功能实现,先看效果界面。 小程序初始界面如1,输入用户名“你是大坏蛋”,密码“wocaibushine”,点击登录效果如2所示,点击重置,效果如3所示。 新建一个小程序,建立普通快速启动模板。 所有东西都不用动, pages/index/index.wxml代码用如下的替换:<form bindsubmit="formBindsubmit" bindreset="formRese
微信小程序开发关于分享功能中怎么定义同一个页面中不同的按钮触发不同的分享内容,或者右上角的分享和页面中分享
微信小程序分享中分为点击右上角的分享和点击按键(即是button组件)的分享.而不同按键的分享可以通过id属性来区分,具体实现如下:.js页面中代码 //分享功能 onShareAppMessage: function (res) { var that = this; //分享的类型为按键类型 if (res.from == &quot;button&quot;)...
编写一个程序,实现一个图形用户界面。在该界面上有一个静态文本框,里面有一段文字。另外还有两个按钮,用于设置文字的颜色:蓝色或红色。当用户选定某个颜色后,文本框中的文字随即也发生变化。(java实现)
要求: 编写一个程序,实现一个图形用户界面。在该界面上有一个静态文本框,里面有一段文字。另外还有两个按钮,用于设置文字的颜色:蓝色或红色。当用户选定某个颜色后,文本框中的文字随即也发生变化。 源代码: package qi_mo; import java.awt.Color; import java.awt.GridLayout; import java.awt.event.Acti...
实战案例1:实现单选按钮及在文本框中展示选中的按钮内容
案例1:实现单选按钮,并将单选按钮内容填充至文本框 (1)元件准备:三个单选按钮,一个button按钮,一个文本框 (2)分析:a.单选按钮的实现;                      b.将选中按钮的内容填充至文本框;                      c.在下一个选中按钮的行为产生之前,对应的单选按钮还是处于选中的状态。 操作步骤: 1.首先在左下角的图形库里选择三个...
一段文字内有不同颜色字体交叉显示
const char* psz = UTEXT("集齐%d个可合成%s\n需要碎片 %d/%d"); CCString* pString = CCString::createWithFormat(psz,nBaseCount,pStrName->getCString(),nCount,nMaxCount); m_pTextInfo->setText(pString->getCStrin
java 中图形界面设计中 用不同按钮实现不同功能
在界面上设计两个按钮  一个实现添加   一个实现删除 可以用两种方法 1.egetsource == btn1    然后实现事件 2.内置函数   将ActionEvent e事件写在 接口addActionListener(new ActionListener() 中 重点就是在由原来的jbtn2.addActionListener(this)中的this变成new ActionLi...
qt小白入门基础中按钮与文本输入框
刚刚使用qt的时候基本上很多都不会,我们就从简单的如何创建一个工程,和按钮与输入框的实验开始吧。一. 新建工程步骤如下:点击New Project然后第二步下图:一般情况下默认第一个 然后下一步:在这一步里面名字和路径最好不用中文,因为可能后面编译会报错,接下来几步默认就可以:如新建好的一个工程如上图。那下面我们点击forms里面的ui界面开始界面布局:我们将用到三个控件:PushButton(按...
按下按键时间长短实现不同功能
打算学STM32的童鞋注意了!!!! 如果你想要把按键玩转。 想要用按键实现各种功能。 想要根据时间的不同执行的不同。 这段代码可以帮助你。 if(Judge_Key()==0)   //按下按键 { rt_thread_delay(MSec(100));    //按键去抖 if(Judge_Key()==0)        { printf("start key1
属性
public class MyUser    ...{        private string name;        private string pwd;        public string Name        ...{            get            ...{                return this.name;            } 
设计一个窗口,窗口中包含有一个文本框,一个标签,两个按钮,当按下“文本一”按纽时,使得“Hello java!”显示在文本框中,按下“文本二”按纽时,使得“你好 Java!” 显示在文本框中(要求两个
设计一个窗口,窗口中包含有一个文本框,一个标签,两个按钮,当按下“文本一”按纽时,使得“Hello java!”显示在文本框中,按下“文本二”按纽时,使得“你好 Java!” 显示在文本框中(要求两个按纽之间使用网格布局,与其他组件共使用Frame默认布局管理)。 import java.awt.Container; import java.awt.GridLayout; import java
Android为按钮设置按压后的不同状态
为按钮设置不同状态的drawable的用到的是StateListDrawable 下面用一个例子来说明如何使用 先通过shapeDrawable来实现两个圆角矩形,不过颜色不一样,即按钮后显示的颜色不一样 shape_btn_normal.xml xml version="1.0" encoding="utf-8"?> shape xmlns:android="http://s
点击不同单选按钮出现不同内容
就我个人来说,我要实现的东西是,审核某个东西,如果通过则不需要填写理由,如果审核不通过则需要填写理由,出现一个文本域&amp;lt;!DOCTYPE html&amp;gt;&amp;lt;html&amp;gt;&amp;lt;head&amp;gt;&amp;lt;meta charset=&quot;utf-8&quot; /&amp;gt;&amp;lt;title&amp;gt;&amp;lt;/title&amp;gt;&amp;lt;script src=&quot;js/jquery.min
复选按钮点击不同,显示内容不同
1,首先写一个复选按钮 *公示类型 : 2.拿到他的字典值 并做判断 mini.get("fkTypeId").select(0); mini.get('fkActivityId').setUrl(contextPath +
一个模仿微信主界面左右滑动和点击按钮进入不同模块的程序
模仿微信左右滑动和点击下面的几个按钮进入不同功能模块的一个demo,很简单,直接看代码就能学会
Qt 之 自定义按钮 在鼠标 悬浮、按下、松开后的效果
一、简述在上一篇 Qt 之 去除窗口部件被选中后的焦点虚线框 中,我们为了去除焦点虚线框,给按钮的样式加上了如下的样式。QPushButton { background:red; border:0px; }这样导致鼠标点击按钮之后没有按下凹陷的反馈感觉是没有点击上去似的。上面两个按钮加上了border:0px;去除了边框,点击之后没有凹陷的感觉,而后两个按钮没有加上border:0p
微信小程序中,点击wx:for渲染的数据,view里的文字颜色改变、展示不同的内容
用wx:for渲染数据,不确定有多少条数据,要使得点击当前数据获取当前数据的下一级数据,描述可能会不太清楚,就是实现图中这种功能: wxml代码: &amp;amp;lt;!-- 这是要展示的规格 --&amp;amp;gt; &amp;amp;lt;view wx:for=&amp;quot;{{items}}&amp;quot; wx:key=&amp;quot;id&amp;quot; bindtap='selShopTc' data-index=&amp;quot;{{index}}&
输入框显示提示文字
input type="text" placeholder="填写昵称">
代码实现 按钮点击出现不同的图片或者颜色
代码实现 按钮点击出现不同的图片或者颜色不仅仅是button可以,像TextView也是可以实现的。改变button的颜色 StateListDrawable stateListDrawable = new StateListDrawable(); ColorDrawable colorDrawableNormal = new ColorDrawable();
Unity3D实现点击按钮本身获取按钮所包含的文本内容且显示出来
  1、创建场景(创建两个Button按钮、一个Text文本) 2、编写按钮监听事件脚本Test_BtnEvent /*** * Title:&quot;XXX&quot; 项目 * 主题:监听按钮的点击事件 * Description: * 功能:XXX * Date:2017 * Version:0.1版本 * Author:Coffee * Modify Recoder: */ using S...
小程序自动判断当前时间段并显示不同内容
小程序自动判断当前时间段并显示不同内容 好吧,判断一天的不同时间段显示不同的内容又是在我的项目中的一个需求,没办法呀,容易忘,还是写着吧 需求:1.把一天分为3个时间段,5:00-11:00 11:00-15:00 15:00-5:00 2.不同的时间段顶部背景色颜色不同 onLoad:function(){ var time = parseInt(new Da...
微信小程序中 input空间输入文字如何清空
场景:希望读取input控件的输入内容之后,清空输入框的内容。由于本人是JS小白,整整花了一两个小时都没找到方法。 原来微信小程序不支持document通过id获取控件的方法,尽管编译不报错,但是实际是不起作用的,本人亲测。 只能通过数据传递的方式实现,方法如下:          功能:按控件“输入”,之后input输入框就会清空 //input.wxml----添加控件
编写java程序,在文本框输入字符串,点击“添加”按钮,文本区显示文本框中内容;点击“清空”按钮,清除文本区所有内容
编写java程序,在文本框输入字符串,点击“添加”按钮,文本区显示文本框中内容;点击“清空”按钮,清除文本区所有内容。
Flutter实现一行文字多种颜色,部分文字设置点击事件
效果图: 上面是效果图,请看有三种效果,第一行是删除效果,第二种是文字设置不同颜色,最后的绿色还可以设置点击,代码如下: import 'package:flutter/material.dart'; import 'package:flutter/gestures.dart'; //import 'ur'; void main() =&gt; runApp(MyApp()); cl...
Java GUI 文本框点击时提示信息消失和弹出窗口在按钮或者标题栏显示倒计时
最近在做课程设计,遇到一些界面设计,比较麻烦,花了一些心思设计,所以在此记录下来,虽然不是最好的,用其他语言或其他方式可能会更简单些。 描述1:JTextField文本框未输入时,在文本框上的提示信息颜色设置为灰色,点击文本框时,提示信息消失,输入的字体颜色变成黑色,再次点击时,输入的信息不会被清空。 先上效果图: 代码Demo.java import javax.swing.JFra...
java实现鼠标监听事件
import java.awt.*; import java.awt.event.*; import java.util.*; public class MyMouseAdapter { public static void main(String args[]) { new MyFrame(&quot;drawing points&quot;); } } class MyFrame extends Fr...
VB在文本框中实现单击窗体的次数
利用vb在文本框中现实单击窗体的次数,源代码
Android按钮按下时和弹起时的颜色设置
(1)首先在res文件夹下新建一个文件夹drawable,这是无关分辨率的,在下面建立一个xml文件:button.xml         (2)然后在values文件下的strings写入如下代码: #FFFFFF  #99E5FE (3)最后在布局文件直接引用即可: android:background="@drawab
微信小程序之设置不同的顶部导航栏名称
一、背景 首先是,我们知道在app.json中,有一个window属性,这个规定了全局的顶部导航栏目的显示: "window": { "backgroundTextStyle": "light", "navigationBarBackgroundColor": "#fff", "navigationBarTitleText": "哈哈", "
微信小程序中点击一个按钮获取文本框中的值
HTML &amp;lt;input bindinput=&quot;talk&quot; /&amp;gt; &amp;lt;button bindtap=&quot;oks&quot;&amp;gt;确认&amp;lt;/button&amp;gt; JS talks:function(e){ this.setData({ talks:e.detail.value }) }...
相关热词 c#异步发送kafka c#窗体编号 c# 操作二进制文件 c# 反射 机制 c#线程 窗体失去响应 c#角度转弧度 c# 解析gps数据 c# vs设置 语法版本 c# json含回车 c#多线程demo

相似问题

5
js实现单选按钮单击选中,再单击取消选中
4
请问微信小程序如何生成Excel文件
3
请问大神微信小程序生成Excel浏览
0
微信小程序如何在按钮上添加图片
2
MFC如何把按钮上的文本拖拽放到编辑框中显示?
3
实现了按钮拖动代码后想在updown里实现鼠标松开将文本显示在编辑框中却实现不了
6
百度富文本上传图片按钮点击无反应??
4
如何将SQL数据库中的文本通过一个按钮显示在MFC的编辑框中
14
jsp页面中怎么实现只要一个按钮就能完成添加和修改两个功能?
15
怎么实现点击提交按钮后使提交按钮变成灰色不可用?
4
如何在Android studio中获取点击按钮时的时刻
4
C# 如何让一个按钮每按一下,按钮里面的的text值发生变化,按六次,有六个不同的值
2
微信小程序video组件层级过高遮挡了悬浮按钮
0
如何使按下主程序运行中弹出子VI的关闭按钮后主程序停止运行
2
C#winform的button按钮状态切换问题
1
html 按钮点击触发script函数设置文本框样式由隐藏变为显示
2
QT 如何让按钮的icon和label的字体随着窗体大小变化?
2
在文本框的失焦事件中计算另外一个文本框的值,点击一个按钮并且获取计算的值。
1
在win10下,右下角显示桌面按钮,win+D(或者M)快捷键,程序的最小化按钮,这四者有什么区别呢?
1
点击不同按钮跳转一个界面显示改界面显示数据库里不同的数据。