如何创建一个在输入字段中记录两个不同值的 onclick 事件？

Question

我正在尝试创建一个 onclick 事件，当您按下两个具有不同值的不同按钮时，它们将被添加到输入字段中。例如，当同时单击两个按钮时，输入值将显示为："13577002, 13577003"。这能做到吗？

< script >
  function myFunction(name) {
    document.getElementById("peep").value = name;
  } < /script>

<html>

<body>
  <table>
    <tr>
      <td><a onclick="myFunction('13577002')" data-toggle="modal" data-target="#myReserve" href="# style=" font-size:10px " class="btn btn-special-sm btn-color btn-xs ">RESERVE NOW</a></td>
            <td><a onclick="myFunction( '13577003') " data-toggle="modal "  data-target="#myReserve " href="# style="font-size:10px" class="btn btn-special-sm btn-color btn-xs">RESERVE NOW</a>
      </td>
    </tr>
  </table>
  <form>
    <label>SKU:
      <input type="text" name="sku" id="peep"></input>
    </label>
  </form>
</body>

</html>

Answer 1

试试这个：

<script>
    function myFunction(name) {
        document.getElementById("peep").value += (',' + name);
    }
</script>

Answer 2

只需使用布尔标志来确定其中是否已存储某些内容，然后适当地连接起来

if(peepFlag)
    document.getElementById("peep").value += ", " + name;
else {
    document.getElementById("peep").value = name;
    peepFlag = true;
}

如果您预计不需要用它做任何其他事情，您甚至不需要标志或 if 语句。但是，为了彻底，我会保留它们

Answer 3

你好，检查这个解决方案：http://jsfiddle.net/leojavier/apbuuhch/1/

<table>
  <tr>
    <td>
      <a data-source="13577002" data-toggle="modal" data-target="#myReserve" href="javascript:void(0)" style="font-size:10px" class="btn btn-special-sm btn-color btn-xs">
        RESERVE NOW
      </a>
    </td>
    <td>
      <a data-source="13577003" data-toggle="modal"  data-target="#myReserve" href="javascript:void(0)" style="font-size:10px" class="btn btn-special-sm btn-color btn-xs">
        RESERVE NOW
      </a>
    </td>
  </tr>
</table>
<form>
  <label>SKU:
    <input type="text" name="sku" id="peep"></input>
  </label>
</form>

js

$('a').on('click',function(){
  $("#peep").val($(this).data('source'));
});

Answer 4

为了防止不必要的添加，您可以这样做：

 function myFunction(name) {
      field=document.getElementById("peep");
     if(field.value!='' && field.value.split(',').length<2 && field.value!=name) {
         console.log(field.value.split(','));
         field.value+=', '+name;
     }
      else if(field.value=='') {
          field.value=name;
      }


  }

演示：http://jsfiddle.net/7mjv2sp2/3/ 实际上还需要一个额外的条件，所以用户不能输入超过两个值，而且它们必须不同......:)

如何创建一个在输入字段中记录两个不同值的 onclick 事件？

How can I create an onclick event that records two different values in an input field?

javascript

forms

jquery

onclick