微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

Dart创建HTML单选按钮无法正常工作

如何解决Dart创建HTML单选按钮无法正常工作

我正在使用Dart动态生成HTML单选按钮输入元素。然后将生成的单选元素显示在HTML文件的div元素中。除了在div元素中看不到每个单选按钮的文本之外,所有其他方法都工作正常。

每个单选按钮的文本描述符在列表中定义。

要正确显示单选按钮,我在做什么不正确?

Dart代码如下:

import 'dart:html';

void main() {

  divelement  outputdiv = querySelector('#output');
  outputdiv.append(RadioButtonsTest('service',['One','Two','Three']));
  
}

Element RadioButtonsTest(String name,List<String> rb) {

  divelement _myelm = new divelement();
  _myelm.classes.add('dradiobuttons');

  print('Lenghth of list RB: ${rb.length}');

  for (var i = 0; i < rb.length; i++) {
    print('Adding a radiobutton element: ${i}');
    _myelm.append(new InputElement()
      ..type = 'radio'
      ..id = 'rb${rb[i]}'
      ..text = rb[i]
      ..name = name
      ..value = rb[i]
      ..classes.add('btnradio')
      );

  }

  return _myelm;
}

下面的代码表示HTML文件,其中包含一个div,其ID为“输出”:

<!DOCTYPE html>

<html>
<head>
    <Meta charset="utf-8">
    <Meta http-equiv="X-UA-Compatible" content="IE=edge">
    <Meta name="viewport" content="width=device-width,initial-scale=1.0">
    <Meta name="scaffolded-by" content="https://github.com/dart-lang/stagehand">

    <title>Test Radio Button</title>
    <link rel="icon" href="favicon.ico">
    <script defer src="main.dart.js"></script>
</head>

<body>

  <div id="output">

  </div>

</body>
</html>

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。