Question

我需要在显示的数据组中动态创建复选框和单选按钮，然后我需要接受用户的选择并将其放入变量中。

我举了一个带有几个复选框和单选按钮的示例，但是我不知道如何实际获取输入：

var t = document.getElementById("container");

var data1 = ['TV', 'Newspaper', 'Internet'];
var data2 = ['New York', 'Washington', 'Los Angeles'];

t.innerHTML += checkbutton(data1);
t.innerHTML += radiobutton(data2);

function checkbutton(d) {
  var output = "";

  for (var i = 0; i < d.length; i++) {
    output += '<input type="checkbox" value=' + d[i] + ' name="box2">' + '   ' + d[i] + '   ' + '<br><br>';
  }
  return output;
}

function radiobutton(d) {
  var output = "";

  for (var i = 0; i < d.length; i++) {
    output += '<input type="radio" value=' + d[i] + ' name="box2">' + '   ' + d[i] + '   ' + '<br><br>';
  }
  return output;
}

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

Answer 1

喜欢吗？

请注意事件侦听器和名称的更改

还要确保您引用了名称和值

import socket
import sys
import string

numeretto = 1;
i = 0

HOST = '192.168.1.8'  
PORT = 8888

pazienti = [1]

s = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
print ('socket created')

# Bind socket to Host and Port
try:
    s.bind((HOST, PORT))
except socket.error as err:
    print ('Bind Failed, Error Code: ' + str(err[0]) + ', Message: ' + err[1])
    sys.exit()

print ('Socket Bind Success!')

# listen(): This method sets up and start TCP listener.
s.listen(10)
print ('Socket is now listening')

while 1:
    conn, addr = s.accept()
    print ('Connect with ' + addr[0] + ':' + str(addr[1]))
    RHOST = addr[0]
    try:
        print(pazienti.index(RHOST))
        print("Elemento trovato non gli invieremo un altro numeretto") 
        ctrl = False
    except Exception as error:
        print(error)
        print("element not found")
        pazienti.append(RHOST)
        #i = i+1
        ctrl = True

    if (ctrl == True):
        message = conn.recv(1024).decode()
        print(message)
        numerettostr = "Il suo numeretto è: " + str(numeretto)
        conn.sendall(numerettostr.encode('utf-8'))
        print("message done")
        numeretto = numeretto + 1

    else:
        message = conn.recv(1024).decode()
        print(message)
        msg = "Impossibile avere un altro numeretto!"
        conn.sendall(msg.encode('utf-8'))

s.close()

function checkbutton(d) {
  var output = "";

  for (var i = 0; i < d.length; i++) {
    output += '<label><input type="checkbox" value="' + d[i] + '" name="box'+i+'">' + '   ' + d[i] + '   ' + '</label><br><br>';
  }
  return output;
}

function radiobutton(d) {
  var output = "";

  for (var i = 0; i < d.length; i++) {
    output += '<label><input type="radio" value="' + d[i] + '" name="rad">' + '   ' + d[i] + '   ' + '</label><br><br>';
  }
  return output;
}

window.addEventListener("load", function() {
  var t = document.getElementById("container");
  var b = document.getElementById("but");

  var data1 = ['TV', 'Newspaper', 'Internet'];
  var data2 = ['New York', 'Washington', 'Los Angeles'];

  t.innerHTML += checkbutton(data1);
  t.innerHTML += radiobutton(data2);

  t.addEventListener("change",function(e) {
    var tgt = e.target;
    if (["radio","checkbox"].indexOf(tgt.type) !=-1) { // only look at checkboxes and radios. Change if needed
      console.log(tgt.value); 
    }
  });
  
  b.addEventListener("click",function() {
    var vars = {}
    t.querySelectorAll("input").forEach(inp => { 
       if (inp.checked) vars[inp.name]=inp.value 
    });
    console.log(vars);
  })

})

Answer 2

使用javascript，您可以查询html元素的特定属性-例如单选按钮和复选框。为了做到这一点，每个元素都应该有一个唯一的ID-这样我们就可以使用document.getElementById(id)来获得一个元素。另一种选择是按元素类型获取元素，例如document.getElementsByTagName("input")。这将返回所有输入元素的html集合-一个数组。通过简单的for循环，您可以遍历此数组，并使用 .checked 属性，可以确定是否选择了这些输入框之一。

var t = document.getElementById("container");

var data1 = ['TV', 'Newspaper', 'Internet'];
var data2 = ['New York', 'Washington', 'Los Angeles'];

t.innerHTML += checkbutton(data1);
t.innerHTML += radiobutton(data2);

function checkbutton(d) {
  var output = "";

  for (var i = 0; i < d.length; i++) {
    output += '<input type="checkbox" value="' + d[i] + '" name="box2">' + '   ' + d[i] + '   ' + '<br><br>';
  }
  return output;
}

function radiobutton(d) {
  var output = "";

  for (var i = 0; i < d.length; i++) {
    output += '<input type="radio" value="' + d[i] + '" name="box2">' + d[i] +  '<br><br>';
  
  }
  return output;
}

function check() {
  var elements = document.getElementsByTagName("input");
  for (var a = 0; a < elements.length; a++) {
        if (elements[a].checked) {
          console.log(elements[a].value + " is checked");
        }	
  }
}

<div id="container"></div>
<button id="check" onclick="check()">
check
</button>

如何从JavaScript中动态创建的复选框和单选按钮获取输入？

2 个答案: