Jquery,将选择值拆分为两个字符串并使用数组分配给两个输入

标签 jquery html

我需要拆分 html 选择选项的值并将拆分结果传递到两个单独的输入字段。我之前尝试对此进行编码,但最终得到了一个不太干的结果。

Could someone help me understand how to pass an array's value to each element in another array? This was even confusing to write. :(

这就是我目前所拥有的;

$(document).ready(function() {

  $('#media-size').change(function() {
    var selectValue = $(this).val();
    var arr = selectValue.split("x");
    var valOne = arr[0];
    var valTwo = arr[1];

      $('.media-value').each(function() {
        $(this).val(arr);
    });
  });
});

这是我一直在研究的 fiddle 的链接; Click Here

任何指导将不胜感激。

问候,-B。

附言

澄清一下,在此问题被标记为重复之前。我正在寻找一个 Jquery 答案,而不是一个 java 答案,这是我似乎能够找到的关于这个主题的所有答案。

最佳答案

其实你真的很近。只需要获取迭代的index即可获取具体的arra值。

我建议您遵循 each() 的 jQuery 文档

希望对您有所帮助:>

$(document).ready(function() {

  $('#media-size').change(function() {
    var selectValue = $(this).val();
    var arr = selectValue.split("x");

    $('.media-value').each(function(index) {
      $(this).val(arr[index]);
    });
  });
});
input {
  margin: .5em;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="custom-select" id="media-size">
  <option value="00x00" selected>Finish Size...</option>
  <option value="594x841">A1</option>
  <option value="420x594">A2</option>
  <option value="297x420">A3</option>
  <option value="210x297">A4</option>
  <option value="148x210">A5</option>
  <option value="105x148">A6</option>
  <option value="74x105">A7</option>
  <option value="85x55">UK Business Card</option>
  <option value="85x54">UK Plastic Card</option>
  <option value="00x00">Custom Size</option>
</select>

<input type="text" class="form-control media-value" placeholder="00" aria-label="Finish size in millimetres" aria-describedby="basic-addon2">
<span>x</span>
<input type="text" class="form-control media-value" placeholder="00" aria-label="Finish size in millimetres" aria-describedby="basic-addon2">

关于Jquery,将选择值拆分为两个字符串并使用数组分配给两个输入,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51214622/

相关文章:

javascript - 在 JavaScript 中从 HTML Canvas 创建 1 位位图

html - CSS 悬停/鼠标移出过渡?

c# - jQuery Accordion 阻止路由链接在 ListView 中工作

javascript - 获取并评估 javascript——为什么不工作?

css - Div 的水平滚动

javascript - 复选框上的 onchange 事件始终显示 this.value = on

html - 使用 angular 和 fxflex 在一条线上制作树形 UI

javascript - 每隔几秒从数组中的值更改类

javascript - jQuery 如何在闭包范围之外可用?

jquery - 将 div 定位到文档宽度?