自己写了一个带输入框的弹窗，但是获取输入框中的内容和点击确定这件事的js代码的逻辑搞不清楚

问题描述：

就是输入框和确定是两个bindtap 要怎么才能实现点击确定之后才把输入框内容用上

答

用数据双向绑定，点击确定时把input的值传上就可以了

答

可以在data里定义一个变量，当input输入的时候绑定bindinput方法一边输入一边实时获取输入的内容赋值给变量，然后点击确定的时候直接取变量的值就好了。

data:{
  input_value = ''
},

get_input_value(e){
  this.setData({
    input_value: e.detail.value
  })
},

答

如果你用 js 写的，给输入绑定一个 id选择器，如：input 绑定 id="myInput", 当你点击确定之后，就可以通过 id选择器获取输入框 input的dom节点，通过 document.getElementById 获取到节点，拿到 value值即为输入框内容

2.如果使用了一些 vue 或者react, vue 可以通过 v-model 实现双向绑定，react 可以通过函数式ref 绑定输入框

答

问:什么时候获取input框的值???

 答 点击确定按钮时

原生js

<!DOCTYPE html>
<html lang="en">
<head>
    <!--
@Description: getValue
@author: 刘 某
@Mailbox: 323574784@qq.com
@date: 2021/7/27
-->
    <meta charset="UTF-8">
    <title>getValue</title>

</head>
<body>
<label>
    <input type="text" id="int">
</label>
<button id="setValue">确定</button>
<script>
    "use strict";
    
    // 点击button时执行
    document.querySelector('#setValue').addEventListener('click',function () {
        // 什么时候打印???
        console.log(document.querySelector('#int').value)
    })
    
</script>
</body>
</html>

自己写了一个带输入框的弹窗，但是获取输入框中的内容和点击确定这件事的js代码的逻辑搞不清楚

相关推荐