javascript - 需要增加输入值，悬停后还保留悬停前状态，使用 Jquery 保留最后一个选择列表项值

Question

这是
JSFIDDLE

当悬停在数字(.clone)元素上时，我希望它
变成“+”，鼠标离开这个元素后，我希望它显示
以前在那里的号码。

每当 (.clone) 中的数字值使用
(.ArrowUp/.ArrowDown) 控件，隐藏输入元素的值
(#ItemCount) 应该增加/减少并反射(reflect)这个值
改变。

正如您所看到的，当计数低于“1”时，受尊敬的
选择列表值设置为“不包括”。理想情况下，我希望
如果有人按下 (.ArrowUp) 和
增加计数，如果过于复杂而不是简单地隐藏整个
(.ArrowAndCount) 会做。但是我希望计数重新出现
如果隐藏并自动递增到“1”如果有人选择了其他值
而不是“不包括”。

当 (.PartModuleWrapper) 被克隆时，我希望值/计数为
将新的 (.clone) 和 (#ItemCount) 设置为“1”。

如果有人能展示最有效的方法来做这些，将不胜感激。

<div class="DropDown">
    <h4>
        Storage</h4>
    <div class="PartModuleWrapper" id="Storage">
        <label class="catname">
            Hard Drive</label>
        <img width="45" height="45" src="http://icons.iconarchive.com/icons/tpdkdesign.net/refresh-cl/256/Hardware-HardDrive-icon.png"
            class="PartThumbnail">
        <div class="itemshortd">
            SATA3, 7200rpm, 3.5"
        </div>
        <select id="mydropdown" name="mydropdown" onchange="OnSuccess(mydata);" part="Storage">
            <option selected="selected" value="18">✔ 1TB SATA3 Seagate HDD</option>
            <option value="23">[+$31] Western Digital 2TB SATA3 yellow</option>
            <option value="0">Do not include</option>
        </select>
        <div class="ArrowAndCount">
            <div class="clone">
                1</div>
            <div class="ArrowUp">
                ▲</div>
            <div class="ArrowDown">
                ▼</div>
        </div>
        <input id="ItemCount" name="ItemCount" type="hidden" value="1">
    </div>
</div>

$(".ArrowUp").live("click", function() {

    var count = $(this).prevAll('.clone').text();

    var countin = parseInt(count);
    if (countin < 9) {
        $(this).prevAll('.clone').text(countin + 1);
        var countvalue = $(this).parent().next().val();
        $(this).parent().next().val(parseInt(countvalue + 1));
    }
    else {
        $(this).prevAll('.clone').text(1);
    }
});



$(".ArrowDown").live("click", function() {



    var count = $(this).prevAll('.clone').text();

    var countin = parseInt(count);

    if (countin > 1) {
        $(this).prevAll('.clone').text(countin - 1);
    }
    else {
        $(this).prevAll('.clone').text(0);
        $(this).parent().prev().val('0');
    }
});


$(".clone").hover(

function() {
    var state = $(this).html();
    $(this).html('+');
},

function() {
    var state = $(this).html();
    $(this).html(state);
}

);





$(".clone").live("click", function() {


    var clone = $(this).parent().parent().clone();



    $(this).parent().parent().append(clone);

    OnSuccess(mydata);
});

Answer 1

更新#3

又更新了!! - http://jsfiddle.net/MHz3t/5/

更新 #2

更新 fiddle :http://jsfiddle.net/MHz3t/4/

更新

检查这个更新的 fiddle :http://jsfiddle.net/MHz3t/3/

您提到的 4 个要求很容易实现。检查 fiddle 的实现。

检查这个 fiddle :http://jsfiddle.net/MHz3t/1/