Question

我现在正在设置使用div标记来触发隐藏的单选按钮。但是，当我在div上单击一次时，单选按钮会切换，但是我必须双击div才能通过ajax发送数据。有关导致此问题的原因以及如何解决问题的任何想法？

的jQuery

$(function(){
    $(".albumcover_tag").click(function(e){
        e.stopPropagation();
        $('.edit_album').trigger('submit.rails');
    });
    $(".albumcover-item").click(function(e){
        $('.albumcover-item').removeClass("radio-selected");
        $(this).addClass("radio-selected");
        $(this).find('input').click();
        return false;
    });
    $('.albumcover_tag:checked').parent('.albumcover-item').addClass("radio-selected");
});

HTML

<div class="albumcover-item">
    <label for="album_albumcover">Set as Album Cover </label>
    <input class="albumcover_tag" id="album_albumcover_id_2" name="album[albumcover_id]" type="radio" value="2">
</div>

注意：我希望能够在单击时启用ajax，而不是双击。

Answer 1

你会在这里找到答案，你必须在触发双击时取消单击。

Need to cancel click/mouseup events when double-click event detected

function singleClick(e) {
    // do something, "this" will be the DOM element
}

function doubleClick(e) {
    // do something, "this" will be the DOM element
}

$(selector).click(function(e) {
    var that = this;
    setTimeout(function() {
        var dblclick = parseInt($(that).data('double'), 10);
        if (dblclick > 0) {
            $(that).data('double', dblclick-1);
        } else {
            singleClick.call(that, e);
        }
    }, 300);
}).dblclick(function(e) {
    $(this).data('double', 2);
    doubleClick.call(this, e);
});

Answer 2

试试这个：

$(function(){
    $(".albumcover-item").click(function(e){
        $('.albumcover-item').removeClass("radio-selected");
        $(this).addClass("radio-selected");
        $('.edit_album').trigger('submit.rails');
    });
});

Answer 3

我通过将ajax请求移动到div元素的click()触发器来修复它。

$(".albumcover-item").click(function(e){
    ...
    $('.edit_album').trigger('submit.rails');
    ...
});

jQuery使用div作为单选按钮

3 个答案: