0
您好我正在使用JQuery Ui作爲多選網格選擇。我不能爲我的生活弄清楚如何將索引的值轉換爲可用的數組/對象。我可以讓他們顯示與價值的div,但試圖讓他們離開那裏和其他東西無濟於事。我花了好幾個小時來看看這個問題,並看到有多個人遇到過類似的問題,我們將不勝感激。從JQuery Ui獲取索引值到一個可用數組中
<!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>• 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>
該代碼可以在www.tonyswoodshed.com看到 – user2048239