0

您好我正在使用可选择的 JQuery Ui 作为多选网格。我一生都无法弄清楚如何将索引的值放入可用的数组/对象中。我可以让它们显示在带有值的 div 中,但试图让它们离开那里并进入其他东西无济于事。我已经花了几个小时来研究这个问题,并且看到很多人有类似的问题,任何帮助都将不胜感激。

<!doctype html>
<html class="" xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en"><head>
<title>Testing</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="Content-Language" content="en">
<meta name="language" content="en">


<link rel="stylesheet" href="css/phpMM.css">


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


<link rel="stylesheet" href="ui/jquery.ui.all.css">
<link rel="stylesheet" href="ui/demos.css"> 


    <script src="../jquery-1.8.3.js"></script>
    <script src="js/jquery.ui.core.js"></script>
    <script src="js/jquery.ui.widget.js"></script>
    <script src="js/jquery.ui.datepicker.js"></script>

    <script src="js/jquery.ui.position.js"></script>
    <script src="js/jquery.ui.menu.js"></script>
    <script src="js/jquery.ui.mouse.js"></script>
    <script src="js/jquery.ui.button.js"></script>

<link rel="stylesheet" href="ui/dropdown.css">  

<link rel="stylesheet" href="ui/multiclicklist.css">
<script src="js/jquery.ui.selectable.js"></script>

  <script src="js/jquery.dropkick-1.0.0.js" type="text/javascript" charset="utf-8"></script>
      <link rel="stylesheet" href="ui/dropkick.css" type="text/css">

<style>
    #Testing { list-style-type: none; margin: 0;  padding: .25em; width: 450px;   height: 185px;}
    #Testing li { margin: 3px;  float: left; width: 100px; height: 80px; font-size: 1.5em; text-align: center;  }
</style>

<script type ="text/javascript">
    var apron = [];

    $(function() {
        $("#Testing").bind("mousedown", function(e) {
            e.metaKey = true;

    }).selectable();
    });

    $(function() {
        $( "#Testing" ).selectable({
            stop: function() {
            var result = $( "#click-result" ).empty();

            $( ".ui-selected", this ).each(function() {
                var Pindex = $( "#Testing li" ).index( this );
                result.append( ", " + ( Pindex + 1 ) );

               });

            }

        }); 
    });

    (function showAlert() {
        var WTF ="why dont it work";
        for (var i = 0; i < apron.length; i++){
            alert(apron[i]);
        };
    });

</script>   

<body>

        <p id="feedback">
            <span>You've selected:</span> <span id="click-result">none</span>.
        </p>

        <strong>&#149; Select Options? </strong> (select all that apply)
            <ol id="Testing" class="multiclicklist">
                <li class="ui-state-default"value="1">Opt 1</li>
                <li class="ui-state-default"value="2">Opt 2</li>
                <li class="ui-state-default"value="3">Opt 3</li>
                <li class="ui-state-default"value="4">Opt 4</li>
                <li class="ui-state-default"value="5">Opt 5</li>
                <li class="ui-state-default"value="6">Opt 6</li>
                <li class="ui-state-default"value="7">Opt 7</li>
                <li class="ui-state-default"value="8">Opt 8</li>
            </ol>

            <input type="button" value="CheckValue" onclick="showAlert();">
</body>


</html>
4

1 回答 1

1

tonyswoodshed.com 上的代码不起作用,但我已经把它放在jsfiddle.

这是:http: //jsfiddle.net/WDd9w/1/您正在寻找的东西吗?

于 2013-02-07T19:21:45.127 回答