Question

我正在尝试创建一个按钮，当通过某种输入（例如，IE；用户名或密码文本框都不为空）输入用户名和密码字段时，该按钮会更改颜色

有没有一种方法可以让我的函数在NativeScript中更改文本框的输入时触发？我曾在其他网站上询问过NativeScript的闲置情况，但似乎从未得到答复。

我认为这是一个相对简单的请求，尤其是当我使用香草JS时。当然，它一定比使用诸如Angular或Vue的框架更简单？

我不想使用框架，我正在寻找一种使用普通JS做到这一点的方法。我尝试了什么？我已经尝试过onChange=""，textChange=""，change=""，但似乎都没有用。

Answer 1

如果您使用不带任何框架的纯JavaScript / TypeScript，则必须在textChange事件之后添加loaded侦听器。

XML

<TextField loaded="onTextFieldLoaded"></TextField>

JS

function onTextFieldLoaded(args) {
  const textField = args.object;
  textField.off("loaded");
  textField.on("textChange", onTextChange);
}

function onTextChange(args) {
  console.log("Changed: " + args.value);
}

Here is a Playground Sample.

Answer 2

您可以使用onkeyup事件触发表单的验证。

请参见下面的代码段

document.addEventListener("load", function(){
  
});

function validate(event){
  if(document.getElementById("username").value.trim()!="" && document.getElementById("password").value.trim()!=""){
    document.getElementById("btn").removeAttribute("disabled");
  }else{ 
    document.getElementById("btn").setAttribute("disabled", "disabled");
  }
}

.enable{
  
}

<div>
  <label for="username"><input type="text" id="username" name="username" onkeyup="validate(event)"/></label>
  <label for="password"><input type="password" id="password" name="password" onkeyup="validate(event)"/></label>
  <button id="btn" value="Submit" disabled>Submit</button>
</div>

Answer 3

编辑了我的全部答案，因为最初我用Javal哈哈给了你一个完整的演示。也许有很多声誉点的人应该制作一个Nativescript标签。

无论如何，您是否尝试过这种方法？

<TextField hint="Enter text" text="" (textChange)="myFunction($event)"></TextField>

OR

var el = page.getViewById("myEl");
el.on("textChange", myFunction);

function myFunction() {
   console.log('woo');
}

这是一些相关的文档：https://docs.nativescript.org/angular/ui/ng-ui-widgets/text-field#text-field-binding

在文本框上更改输入时调用功能？

3 个答案: