当前位置：文江博客话题详情

原型：如何将选定的选项从一个选择移动到另一个选择？

发布于 2024-10-06 04:05:40 字数 80 浏览 0 评论 0原文

使用原型 1.6 如何从一个选择中删除所有选定的选项并将它们附加到另一个选择中？我想我应该补充一点，当它们出现在目标中时，不应选择它们......

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

ゃ懵逼小萝莉 2024-10-13 04:05:40

我找到了答案，其中涉及仅使用“plain-jane”javascript 来获取所选选项并取消选择它们。它使用原型 1.6 并且工作正常。

<head>

    <script type="text/javascript" src="prototype.js"></script>

</head>

<body>

    <h1>Hello World</h2>

    <div style="border:solid 1px black">

        <select id="leftSelect" multiple="multiple" size="3">
            <option value="1">One</option>
            <option value="2">Two</option>
            <option value="3">Three</option>
        </select>

        <span class="test">
            <button id="moveRightBtn">>></button><br/>
            <button id="moveLeftBtn"><<</button>
        </span>

        <select id="rightSelect" multiple="multiple" size="3">
            <option value="1">One</option>
            <option value="2">Two</option>
            <option value="3">Three</option>
        </select>

    </div>

    <script type="text/javascript">

        document.observe("dom:loaded", function()
        {
            Event.observe("moveRightBtn", "click", function()
            {
                move($("leftSelect"), $("rightSelect"));
            });

            Event.observe("moveLeftBtn", "click",  function()
            {
                move($("rightSelect"), $("leftSelect"));
            });
        });

        function move(sourceSelect, targetSelect)
        {
        var options = sourceSelect.select("option");

        options.each(function(item)
        {
           if(item.selected)
           {
              item.selected = false;
              targetSelect.appendChild(item.remove());
           }
        });
        }

    </script>

</body>

I found the answer, which involved just using "plain-jane" javascript to get the selected options and de-select them. This uses prototype 1.6 and works fine.

<head>

    <script type="text/javascript" src="prototype.js"></script>

</head>

<body>

    <h1>Hello World</h2>

    <div style="border:solid 1px black">

        <select id="leftSelect" multiple="multiple" size="3">
            <option value="1">One</option>
            <option value="2">Two</option>
            <option value="3">Three</option>
        </select>

        <span class="test">
            <button id="moveRightBtn">>></button><br/>
            <button id="moveLeftBtn"><<</button>
        </span>

        <select id="rightSelect" multiple="multiple" size="3">
            <option value="1">One</option>
            <option value="2">Two</option>
            <option value="3">Three</option>
        </select>

    </div>

    <script type="text/javascript">

        document.observe("dom:loaded", function()
        {
            Event.observe("moveRightBtn", "click", function()
            {
                move($("leftSelect"), $("rightSelect"));
            });

            Event.observe("moveLeftBtn", "click",  function()
            {
                move($("rightSelect"), $("leftSelect"));
            });
        });

        function move(sourceSelect, targetSelect)
        {
        var options = sourceSelect.select("option");

        options.each(function(item)
        {
           if(item.selected)
           {
              item.selected = false;
              targetSelect.appendChild(item.remove());
           }
        });
        }

    </script>

</body>

回复收藏 0 原文

~没有更多了~