时间戳

首页 > 解决方案 > 在输入表单中插入值

javascript - 在输入表单中插入值

问题描述

选择一张图像时...

<div class="selectable">
  <img src="https://glarza.com/imagens/tamanho-33.webp" class="ui-widget-content"value="SIZE-33"width="60"height="60">
  <img src="https://glarza.com/imagens/tamanho-34.webp" class="ui-widget-content"value="SIZE-34"width="60"height="60">
 </div>

此功能选择大小...

<script>    
    $(function() {
  $(".selectable").selectable({
    selected: function() {
      var selectedItemList = $("#medida-selecionada-dalista").empty();
      $(".selectable img").each(function(index) {
        if ($(this).hasClass("ui-selected")) {
          selectedItemList.append(
              
              $(this).attr("value") ); } });}});});
    </script>

并在 id 内显示选定的大小...

<span id="medida-selecionada-dalista"></span>
我的问题...我需要在这个输入中插入这个值。我只需要这个。其他输入存储在mysql中。

 <input type="size" class="form-control" id="size" name="size" value="">

标签： javascripthtmljquerycssinsert

解决方案

像这样？

$(function() {
  $(".selectable").selectable({
    selected: function() {
      var selectedItemList = $("#medida-selecionada-dalista").empty();
      $(".selectable img").each(function(index) {
        if ($(this).hasClass("ui-selected")) {
          selectedItemList.append(
            $(this).attr("value")
          );
          /* insert into input */
          document.getElementById("size").value = this.getAttribute("value");
        }
      });
    }
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<input type="size" class="form-control" id="size" name="size" value="">

<span id="medida-selecionada-dalista"></span>

<div class="selectable">
  <img src="https://glarza.com/imagens/tamanho-33.webp" class="ui-widget-content" value="SIZE-33" width="60" height="60">
  <img src="https://glarza.com/imagens/tamanho-34.webp" class="ui-widget-content" value="SIZE-34" width="60" height="60">
</div>

PS尽可能避免使用jquery...

推荐阅读