Javascript 计算两个可拖放对象内的项目_Javascript_Php_Jquery_Jquery Ui Draggable_Jquery Ui Droppable

Javascript 计算两个可拖放对象内的项目

javascript php jquery

Javascript 计算两个可拖放对象内的项目,javascript,php,jquery,jquery-ui-draggable,jquery-ui-droppable,Javascript,Php,Jquery,Jquery Ui Draggable,Jquery Ui Droppable,我有一个手风琴和两个可放下的盒子：盒子1和盒子2。如何计算两个框中丢弃的项目总数。这是我在函数（event，ui）{中添加了函数，但是如果我有一个两个或更多的循环，它会对每一行计数。我如何将它分开下面是循环代码： <body style="background-color:white;" onload="startTime()"> <h1 class="ui-widget-header">Products</h1> <div id="myA

我有一个手风琴和两个可放下的盒子：盒子1和盒子2。如何计算两个框中丢弃的项目总数。这是

我在

函数（event，ui）{

中添加了函数，但是如果我有一个两个或更多的循环，它会对每一行计数。我如何将它分开

下面是循环代码：

<body style="background-color:white;" onload="startTime()"> 
<h1 class="ui-widget-header">Products</h1>    
<div id="myAccordion">
<h3><a href="#">T-Shirts</a></h3>
    <div>
        <ul>
            <li>Lolcat Shirt</li>
            <li>Cheezeburger Shirt</li>
            <li>Buckit Shirt</li>
        </ul>
    </div>
<h3><a href="#">Bags</a></h3>
    <div>
        <ul>
            <li>Zebra Striped</li>
            <li>Black Leather</li>
            <li>Alligator Leather</li>
        </ul>
    </div>
<h3><a href="#">Gadgets</a></h3>
    <div>
        <ul>
            <li>iPhone</li>
            <li>iPod</li>
            <li>iPad</li>
        </ul>
    </div>
</div>
<label>
<?php
    $len=2;
    for($y=0;$y<$len;$y++)
    {
        echo "<div class='proc'> <pre>";
        echo "<span> </span><br /></pre>";  
?>
    <div id="procLeader">
        <label>Box1:</label>
        <div class="ui-widget-content">
        <div id="procleader">
            <ol>
                <li class="placeholder" name="procleader">Add here</li>
                <input type="hidden" name="procleader" id="hiddenListInput3" />
            </ol>
        </div>
        </div>
    </div>
    <div id="procChecker">
        <label>Box2:</label>
        <div class="ui-widget-content">
        <div id="procchecker">
            <ol>
                <li class="placeholder" name="procchecker">Add here</li>
                <input type="hidden" name="procchecker" id="hiddenListInput4" />
            </ol>
        </div>
        </div>
    </div>
<?php       
    echo "</div>";                      
    }
?>
</label>
</body>


产品

棒棒糖衬衫
奶酪汉堡衬衫
布基特衬衫


斑马条纹
黑色皮革
鳄鱼皮


iPhone
iPod
iPad

这样应该行得通，试着移动以下几行
drop: function(event, ui)

里面
//add style
$('.ui-droppable').find("li.ui-draggable:contains('" + zz + "')").addClass('bred');
var n = $( ".dropClass" ).length;   
$( "span" ).text( "Items Dropped: " + n + ".");

因此，您的最终代码如下所示：
$( document.body ).append( $( ".dropClass" ) );

试试这个。
如果可行，请尝试移动以下行
drop: function(event, ui)

里面
//add style
$('.ui-droppable').find("li.ui-draggable:contains('" + zz + "')").addClass('bred');
var n = $( ".dropClass" ).length;   
$( "span" ).text( "Items Dropped: " + n + ".");

因此，您的最终代码如下所示：
$( document.body ).append( $( ".dropClass" ) );

试试这个。
删除
var n = $( ".dropClass" ).length;   
$( "span" ).text( "Items Droped: " + n + ".");

和外接程序函数drop
删除
var n = $( ".dropClass" ).length;   
$( "span" ).text( "Items Droped: " + n + ".");

和外接程序函数drop
谢谢你的回答，但如果我有循环，我如何能分开每个计数？有什么想法吗？你可以看到编辑后的帖子，谢谢回答，但如果我有循环，我如何能分开每个计数？有什么想法吗？你可以看到编辑后的帖子，谢谢