javascript - 关于微信小程序js前端中输入定位的问题
天蓬老师
天蓬老师 2017-05-19 10:11:40
0
3
743

1.写了一个微信小程序,一个数独游戏,根据输入的数判断其是否满足要求(数独规则),但遇到了一个问题,如何找到用户输入的数的位置,因为需要根据位置将数传入到对应的脚本文件中判断是否满足规则,但由于不太熟练js,所以解决不了定位问题。

  1. <view class="page-body">

    <view class="bc" wx:for="{{numbers}}" wx:for-item="row" >
        <view wx:for="{{row}}" class="bc_ bc_{{item}}" bindtap="oninput"> 
          <input wx:if="{{item == 0}}" auto-focus wxkey="*this" maxlength="1" value="" onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpaste="this.value=this.value.replace(/\D/g,'')" type="number" style="color:#000000" bindinput="EventHandle"/>
          <view wx:else>{{item}}</view>
        </view>
    </view>

    </view>

其中numbers是脚本文件中的数组,用两个循环实现了样式。
其中会判断每个数字是否为零(我们在一开始时人为写的数组,0代表给用户输入)如果为零则在此处不显示字符(串)。


这里是前端的显示代码以及显示效果,空白处用于用户填写数字,但不知道怎么去找到用户在哪里输入了数字,希望大神可以指导一下。

天蓬老师
天蓬老师

欢迎选择我的课程,让我们一起见证您的进步~~

全部回复(3)
我想大声告诉你

说一下我的思路,仅供参考:
每个小方格作为一个对象,拥有x和y属性,表示第x行的第y个方格,通过外部p盒子的大小,计算每个小方格的大小,进而可以知道每个小方格的区域范围,用户点击时,获取点击点的坐标,计算落在哪个小方格里面。
总之,就是一个数学计算问题

洪涛

思路:
每个方格具有 data-x='??' 和 data-y='??' 属性,用户点击的时候就可以获取到 x 和 y,然后进行后续计算和判断。

滿天的星座

微信小程序中的event对象是经过处理的,里面含有input的value属性。
微信小程序 - 事件

具体说下我的思路:
微信小程序的event中可以存储元素设置的额外数据,例如你在dom中写入data-x的属性,那么就可以用event.target.dataset.x取出来。
如果是表单元素的话,例如input的value,则是存在event.detail.value中。
你可以给input监听一个事件,然后给元素写上data-x,data-y的属性,属性的值为numbers和row的下标(也就是index,为了避免混淆,要用wx:for-index="XXX"给两个下标别名),通过下标值确定用户点击的位置,然后存储在数组的相应位置中。

array[x][y].push(event.detail.value)
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板