问在Squarespace中显示/隐藏表单域

EN

<p>Number of products</p>
<select id="select" onChange="create.input()"></select>
<div id="input"></div>

const create = {
  select: () => {
        let select = document.getElementById('select')
    // Create 1-10 number of products
    new Array(10).fill(0).forEach((x, i) => {
      let option = document.createElement('option')
      option.innerHTML = (i+1)
      option.value = (i+1)
      select.appendChild(option)
    })
  },
  input: () => {
    let input  = document.getElementById('input')
    let select = document.getElementById('select')
    console.log(select.value)
    // Remove all child
    input.innerHTML = ''
    // Create the same number of input has you select in select ...
    const size = parseInt(select.value, 10)
        new Array(size).fill(0).forEach((x, i) => {
      console.log(i)
      let p_input = create.p_input(i)
      p_input.forEach(x => input.appendChild(x))
    })    
  },
  p_input: index => {
    let name = `erial number` + (index > 0 ? ' ' + (index+1) : '')
    
    let serial_p = document.createElement('p')
    serial_p.innerHTML = 'S' + name
    serial_p.id = 'p-serial-' + index
    serial_p.class = 'p-serial'
    
    let serial_p_confirm = document.createElement('p')
    serial_p_confirm.innerHTML = 'Confirm s' + name
    serial_p_confirm.id = 'pc-serial-' + index
    serial_p_confirm.class =  'pc-serial'

        let serial_input         = document.createElement('input')
    serial_input.type = "text"
    serial_input.id   = "serial-input-" + index
    serial_input.class =  'serial-input'

    let serial_input_confirm = document.createElement('input')
    serial_input_confirm.type = "text"
    serial_input_confirm.id   = "serial-input-confirm-" + index
    serial_input_confirm.class =  'serial-input'
    
    return [serial_p, serial_input, serial_p_confirm, serial_input_confirm]
  }
}
create.select()
create.input()