Javascript JS(jQuery):随机触发点击2行表

Javascript JS(jQuery):随机触发点击2行表,javascript,jquery,random,triggers,Javascript,Jquery,Random,Triggers,鉴于此HTML: <div id="TABLE1" class="tabs"> <table> <tbody datasrc="Music"> <tr id="randomid">lorem</tr> <tr id="foo">lorem</tr> <tr id="abcde">lorem</tr&g

鉴于此HTML:

<div id="TABLE1" class="tabs">
    <table>
        <tbody datasrc="Music">
            <tr id="randomid">lorem</tr>
            <tr id="foo">lorem</tr>
            <tr id="abcde">lorem</tr>
            <tr id="fghijk">lorem</tr>
            <tr id="lmnop">lorem</tr>
            <tr id="qwerty">lorem</tr>
        </tbody>
    </table>
</div>
<div id="TABLE_2" class="tabs">
    <table>
        <tbody datasrc="Music">
            <tr id="random5">lorem</tr>
            <tr id="farhaf">lorem</tr>
            <tr id="haerf">lorem</tr>
            <tr id="hagasdg">lorem</tr>
            <tr id="hrfafh">lorem</tr>
            <tr id="qwerty">lorem</tr>
        </tbody>
    </table>
</div>
<div id="LASTTABLE" class="tabs">
    <table>
        <tbody datasrc="Music">
            <tr id="rtefdgag">lorem</tr>
            <tr id="wrtjfd">lorem</tr>
            <tr id="reaht">lorem</tr>
            <tr id="aggag">lorem</tr>
            <tr id="rthhre">lorem</tr>
            <tr id="argarg">lorem</tr>
        </tbody>
    </table>
</div>
但是这个触发器只是第一个表的第一行

那么,我怎样才能:

当我按下按钮时, 从每个表中获取2个随机行,触发器 每10毫秒单击一行,使他们有一个订单。 关于应用程序:


这是一个音乐播放器网站。每张桌子有不同风格的音乐。摇滚乐、另类音乐、爵士乐等。有一个按钮“随机选择音乐”。该按钮将触发每个表中的2个随机tr,因此您将在播放列表中添加2首爵士乐歌曲、2首摇滚歌曲等。该表看起来是这样的:但这些复选框不是实际的复选框,而是图像,它们在单击时改变位置,使外观和感觉比复选框更好,并且仍然与复选框相同


用户可以通过单击行逻辑上的任意位置触发“复选框”或选择歌曲,因此后端的开发方式是捕获行中任意位置的单击,而不是特定的复选框,因此我不选择触发这些。我不认为有更好的解决方案,只是触发随机点击2行从每个tble

支持IE8+

更新了小提琴上的新代码

也许更像这样

$(function() {
    $("button").click(function(e) {
        $(".selected").removeClass("selected");

        $("table").each(function(i) {
            var irand = {
                a: Math.floor((Math.random()*($(this).find("tr").length)-1)+1),
                b: undefined
            };

            while (irand.b == irand.a || irand.b == undefined) {
                irand.b = Math.floor((Math.random()*($(this).find("tr").length)-1)+1);
            };

            console.log($(this).find("tr").filter(function(i) { return i == irand.a || i == irand.b }).addClass("selected"));
        });
    });
});​
请看下面我的版本

注意:下面的代码有一些演示代码和冗余变量,您可以对它们进行清理,但我将其保留在那里,以使代码看起来清晰易懂

$(function() {
    var $tables = $('table'); //gets the tree tables

    var mQ = []; //music queue
    var timer = null;
    $('button').click(function () {
        $('#result').html(''); //demo code
        var t = 0, $tr;
        var t1 = [];
        $tables.each(function () {
            $tr = $(this).find('tr');

            t1[0] = Math.floor(Math.random()*$tr.length);
            t1[1] = Math.floor(Math.random()*$tr.length);

            while (t1[0] == t1[1]) { //To make sure not same row is selected
                t1[1] = Math.floor(Math.random()*$tr.length);
            }

            mQ.push($tr.get(t1[0]));
            mQ.push($tr.get(t1[1]));
        });

        timer = setInterval(function () {//Create timer to trigger click every 10ms
            if (mQ.length == 0) {
                clearInterval(timer);
                return false;
            }
            $(mQ.shift()).click().addClass('selected');            
        }, 10);
    });

    $('tr').click(function () {
        //do your magic
        $('#result').append(this.id + '<br />');
    });
});

我首先建议你用不同的方式来做,但是如果你想触发点击事件,这里有一个大致的想法

  $(".tab").each(function(){
        var count = $(this).children(tr).length;    
        var r1 = Math.floor(Math.random()*count); //Get a random number less than the total count of rows
        $(this).children('tr').eq(r1).trigger('click');//retrieve the nth (r1) item in the list and fire it's trigger event

    });

你的最终目标是什么?通过随机单击两个表行,您到底想要实现什么?是的,因为如果您试图制作某种动画或创建动态内容或您拥有的内容,有比在随机表中的随机行上随机模拟单击事件更好的方法。如果人们知道你的最终目标是什么,他们可能会为你提供一个比你正在尝试的更好的解决方案。这是一个音乐播放器网站。每张桌子有不同风格的音乐。摇滚乐、另类音乐、爵士乐等。有一个按钮“随机选择音乐”。该按钮将触发每个表中的2个随机tr,因此您将在播放列表中添加2个爵士乐和2个摇滚乐。该表看起来是这样的:但这些复选框不是实际的复选框,而是图像,它们在单击时会改变位置,使外观和感觉比复选框更好,并且仍然与复选框相同。用户可以通过单击行上的任意位置触发“复选框”或行,因此,开发后端是为了捕获一行中任意位置的点击,我不认为有更好的解决方案,可以从每个tble中随机触发两行点击。您支持哪些浏览器?你会用css3吗?随机第N个孩子电话?这实际上不起作用。它是为我的测试用例设计的。我提到了应用程序是什么,因此我有3个以上的表,大约40个。也就是说,我需要补足40兰特,这不是我要找的。所有桌子的tr长度都一样吗?没有。一点也不。桌子是音乐类别。每个类别大约有100首歌曲。也就是说,一些可能有110,其他87,其他158等等。更新的小提琴,我认为它正符合你的要求,think@Vega我提交答案只是出于好奇。但你的答案是最好的。
  $(".tab").each(function(){
        var count = $(this).children(tr).length;    
        var r1 = Math.floor(Math.random()*count); //Get a random number less than the total count of rows
        $(this).children('tr').eq(r1).trigger('click');//retrieve the nth (r1) item in the list and fire it's trigger event

    });