javascript - jQuery 随机重复的 html/jquery 字段

标签 javascript jquery html

我的 jQuery 脚本和 html 脚本有问题。我有一个下拉菜单,对于所选选项,耗材字段(voorraad)中显示一个随机生成的数字。但是当我使用“添加”按钮克隆该字段时,这些选项仅适用于一个耗材字段。有人知道如何解决这个问题吗?

我想要的解决方案是,对于每个下拉菜单,随机生成的数字显示在右侧的耗材字段中

html

<p id="drops">
    <section id="down">
            <select size ="1" name="">
            <option value="" selected="default">Geen voorkeur</option>
            <option value="">Hatseflats Pharma</option>
            <option value="">ZuydGeest</option>
            <option value="">Pharmalicious</option>
            <option value="">Karma op die Pharma</option>
            <option value="">Boemklats Pharma</option>
           </select>
      <select size ="1" name="" class="medicijnen" onchange="document.getElementsByName('voorraad').value = (Math.floor(Math.random() * 100))">
            <option value="" selected="default" disabled="default">Kies een product</option>
            <option value="">Paracetamol 5g</option>
            <option value="">Paracetamol 10g</option>
            <option value="">Aspirine 5g</option>
            <option value="">Aspirine 15g</option>
            <option value="">Donperidon 5g</option>
            <option value="">Donperidon 10g</option>
            <option value="">Ergonimon 6g</option>


           </select>
           <label>Voorraad: </label> <input type="text" id="medicijnen" name="voorraad"  size="5" readonly>
           <label>Aantal:</label> <input size="5" type="text" name="aantal">
         <img src="delete.png" height="16"  class="remove" id="rmv" width="16"/>
           </section>
       </p>
    <p>
        <button class="add" id="btn" value="add field">Bestelregel toevoegen</button>
    </p>

以及我的 jQuery 部分:

$(function() {
    var counter = 1;

    $("#btn").live("click", function() {
        $("#down:first").clone().appendTo("#drops").addClass("lang" + counter);
        counter++;
        return false;
    });

    $("#rmv").live('click', function() {
        if (counter > 1) { //Only apply if the lang field is more than 1
            counter = counter - 1;
            $("#down:last").remove();
        }
        return false;
    });

});
    $(".medicijnen").change(function() {
    var voorraad = 0;
    $.each($(".medicijnen") , function(){
        voorraad = Math.floor(Math.random() * 50) + 1
        });
    $("#medicijnen").val(voorraad)
    });

最佳答案

如果我正确理解您的问题,当“Kies een 产品”列表框中有选择时,您希望“Voorraad”文本框填充随机数吗?

如果是这样,您不需要使用内联 js 触发器来启动它。这是一个 jquery 脚本,可以为您完成这项工作:

$('.medicijnen').change(function(){
    var stock = Math.floor(Math.random() * 50) + 1;
    $('#medicijnen').val(stock);
});

此外,这是代码工作的 JSlint(注意我必须更改一些文本才能理解发生了什么)- http://jsfiddle.net/t2D6S/

希望这能让您走上正确的道路。

更新: 因此,我能够复制列表,并且还能够填充股票,但是股票仅填充在第一个列表上,而不填充在任何其他列表上。

这是更新后的 fiddle = http://jsfiddle.net/q8f4K/

抱歉,我无法提供更多帮助。也许其他人可以修复最后一点。

关于javascript - jQuery 随机重复的 html/jquery 字段,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21021510/

相关文章:

javascript - 如何停止事件传播?

javascript - 选中 Angularjs 复选框启用输入字段

php - div 中的文本不会转到下一行

html - 如何禁用 HTML 中大字的表格大小调整

javascript - 将背景颜色属性设置为整个文档

JavaScript 冲突导致页面无法正确显示

javascript - 自动完成列表固定位置浏览器调整大小

javascript - 如何停止警告框按回车循环?

jquery - 如何动态调整 jQuery Colorbox 插件的大小?

html - 如何在 bootstrap 中放置一个容器(两行)和两个容器(在不同的两行)?