Question

刚开始使用dartlang并将项目示例扩展了一点。似乎类Element上的焦点方法不起作用，或者我可能没有正确使用它。希望获得“焦点”在“错误”上的验证行为。这是我的代码......

#import('dart:html');

num rotatePos = 0;

var nameField;

const DEFAULT_VALUE = "Click here!";

void main() {

  query("#text").text = DEFAULT_VALUE;

  query("#submit").on.click.add(rotateText);
}

void rotateText(Event event) {
  rotatePos += 360;

  nameField = query("#name");

  var textElement = query("#text");

  String insertedName = nameField.value;

  textElement.style.transition = "1s";
  textElement.style.transform = "rotate(${rotatePos}deg)";

  updateFromElement(textElement, insertedName);
}

void updateFromElement(Element textElement, String value) {

  Element errorField = query("#errorValue");

  if (value == "") {
    errorField.text = "Text Field is empty, please insert a value!";
    errorField.style.color = "red";
    textElement.text = DEFAULT_VALUE;
    textElement.focus();
  } else {
    textElement.text = value;
    errorField.text = "";
  }
}

Element.focus（）好像不起作用，也许我在这里想念一些东西。还要添加HTML文件以便更好地理解：

<!DOCTYPE html>

<html>
  <head>
    <meta charset="utf-8">
    <title>Sandbox</title>
    <link rel="stylesheet" href="sandbox.css">
  </head>
  <body>
    <h1>Sandbox</h1>

    <p>Dart Sandbox</p>

    Enter any text: <input type="text" id="name"> <input type="button" value="Submit" id="submit"> <div id="error"><p id="errorValue"></div>

    <div id="container">
      <p id="text"></p>
    </div>

    <script type="application/dart" src="web/sandbox.dart"></script>
    <script src="http://dart.googlecode.com/svn/branches/bleeding_edge/dart/client/dart.js"></script>
  </body>
</html>

Answer 1

我只是试着嘲笑你所拥有的样本。向HTML中添加一些组件以大致创建相同的效果。我找到了你的问题：

var textElement = query("#text");
// ....
updateFromElement(textElement, insertedName);

您传递的textElement是<P>（段落）元素。不是文本字段。所以你不能在它上面调用focus（）。试试这个：

updateFromElement(nameField, insertedName);

Answer 2

感谢Matt B，我能够看到错误...我不会像他建议的那样改变参数。无论如何，这是一个丑陋的模式。但为了使这项工作正常，只需交换以下内容：

- textElement.focus（）;
+ nameField.focus（）;

此方法的更好措辞是“updateToElement（Element targetElement，String value）”

如何将光标移动到Dart中的元素？

2 个答案: