将项目吐入不同的数组并将其检索回来

时间:2012-05-29 07:15:40

标签: javascript jquery if-statement

这与我之前提出的问题有关,并感谢这里的每个人帮助我学习编码:D

我之前正在制作一个撤销按钮,哪种工作但还没有:(

这就是我所做的click here。但问题是因为它一步一步地向后移动它必须等到在同一部分中应用前一种颜色的项目。有没有办法可以解决这样的问题click here这个想法会成功吗?

这是测试html代码:

  <div id="colour">
    <input type="submit" name="r1" id="r1" value="1" />
    <input type="submit" name="r2" id="r2" value="2" />
    <input type="submit" name="r3" id="r3" value="3" />
    <input type="submit" name="r4" id="r4" value="4" />
    <input type="submit" name="r5" id="r5" value="5" />
    <input type="submit" name="r6" id="r6" value="6" />
 </div>
 <div id="map">
    <input type="radio" name="radio" id="layer_a" value="a" />
    <label for="layer">layer_a</label>
    <input type="radio" name="radio" id="layer_b" value="b" />
    <label for="layer">layer_b</label>
    <input type="radio" name="radio" id="layer_c" value="c" />
    <label for="layer">layer_c</label>
    <input type="radio" name="radio" id="layer_d" value="d" />
    <label for="layer">layer_d</label>
 </div>
 <input name="selected" id="selected" type="hidden" value="" />

 <input type="submit" name="undo" id="undo" value="undo" />

 <div id="result"></div>

这是测试jQuery代码:

 $("#colour input").click(function() {
    $("input[name='selected']").val(this.id);
 });
 var arraymap = [];
 var array_a = [];
 var array_b = [];
 var array_c = [];
 var array_d = [];

 $("#map input").click(function() {
    var mape = $(this).attr('id');
    var ccurrent = $("input[name='selected']").val();
    arraymap.push(mape);

    // trying to split it into diffrent arrays //
    if (mape == "layer_a") {
            array_a.push(ccurrent);
            var araycurrent = array_a;
    } else if (mape == "layer_b") {
            array_b.push(ccurrent);
            var araycurrent = array_b;
    } else if (mape == "layer_c") {
            array_c.push(ccurrent);
            var araycurrent = array_c;
    } else if (mape == "layer_d") {
            array_d.push(ccurrent);
            var araycurrent = array_d;
    };

    var mapid = arraymap[arraymap.length - 1];
    var colid = arraycurrent[arraycurrent.length - 1];

    var loca = mapid + colid;

    $("#result").append(mapid);
 });

 $("#undo").click(function() {
    arraymap.pop();
    var remover_map = arraymap[arraymap.length - 1];

    // trying get it back from split arrays //
    if (remover_map == "layer_a") {
            array_a.pop();
            var remover_col = array_a[array_a.length - 1];
    } else if (remover_map == "layer_b") {
            array_b.pop();
            var remover_col = array_b[array_b.length - 1];
    } else if (remover_map == "layer_c") {
            array_c.pop();
            var remover_col = array_b[array_c.length - 1];
    } else if (remover_map == "layer_d") {
            array_d.pop();
            var remover_col = array_a[array_d.length - 1];
    };

    var remove = remover_map + remover_col;

    $("#result").append(remove);

 });

1 个答案:

答案 0 :(得分:1)

您可以将图层数组存储在对象中,以将其用作关联数组。这样,您可以通过图层名称轻松引用它们。

以下是我的示例版本:(工作演示:http://jsfiddle.net/qbdyp/

var step_layer = [];  // layers affected by each step
var step_colour = {  // selected colours by layer
    "a": [],
    "b": [],
    "c": [],
    "d": []
};

var $map = $("#map"), $result = $("#result");  // cache
$("#colour > input").click(function() {
    var layer = $map.find("input[name='radio']:checked").val();  // current layer
    var colour = this.value;  // selected colour
    step_layer.push(layer);
    step_colour[layer].push(colour);
    $result.append("Added " + colour + " to layer " + layer + "<br/>");
});

$("#undo").click(function() {
    var layer = step_layer.pop();  // get most recently changed layer
    if (typeof layer === "undefined") {
        $result.append("(Nothing to undo)<br />");
        return;
    }
    var colour = step_colour[layer].pop();  // get latest change in that layer
    $result.append("Removed " + colour + " from layer " + layer + "<br/>");        
});

这是一个更详细的例子,希望更接近你想要实现的目标:http://jsfiddle.net/uWUve/