MouseEnter上的簡單JQuery顯示問題

我是新來的stackoverflow和Jquery，所以我想提前爲我的經驗/天真道歉。MouseEnter上的簡單JQuery顯示問題

所以基本上我試圖讓一個div出現在按鈕處於mouseEnter狀態時。

這是我在jQuery的嘗試......

$('#main-button-btn-cart').bind('mouseenter', function() { 
    var $select_button = $('#select-product-reminder'); 

    $select_button.style.display = 'inline-block'; 
});

和HTML是...

<div id="select-product-reminder" style="width:200px; height:30px; background-color:#F00; display:none;">Please Choose an Item</div> 
    <button type="button" id="main-button-btn-cart" title="<?php echo $this->__('Add to Cart') ?>" class="button btn-cart" onclick="productAddToCartForm.submit()"> 
     <?php echo $this->__('+ADD TO CART') ?> 
    </button>

出於某種原因，這個代碼不起作用。然而，注意到如果我在綁定函數中包含一個警告框，警告框會出現。

在此先感謝您的任何意見！

來源

2011-07-05 Nathaniel Wendt

這應該做的伎倆;

$('#main-button-btn-cart').mouseenter(function() { 
    var $select_button = $('#select-product-reminder'); 
    $($select_button).css('display','inline-block'); 
});

或者你可以取消var;

$('#main-button-btn-cart').mouseenter(function() { 
    $('#select-product-reminder').css('display','inline-block'); 
});

點擊更新;

$('#main-button-btn-cart').mouseenter(function() { 
    $('#select-product-reminder').css('display','inline-block'); 
    $(this).click(function() { 
    alert('You clicked the button'); 
    }); 
});

來源

2011-07-05 17:46:40

更好的使用.show（）代替.css（'display'，'inline-block'） – Rbacarin

謝謝，完美無缺！ –

現在我正在嘗試更改提交按鈕的onclick值。我將如何使用JQuery來做到這一點？ –

你可以這樣做：

$('#main-button-btn-cart').bind('mouseenter', function() { 
    $('#select-product-reminder').show(); 
});

，你也可以做到這一點

$('#main-button-btn-cart').onmouseenter(function() { 
    $('#select-product-reminder').show(); 
});

OnMouseEnter在一條捷徑，而不是調用bind函數

來源

2011-07-05 17:47:27 developerdoug

謝謝！欣賞它 –

我會用的東西看起來像這樣： $（'＃main-button-btn-cart'）。live （'mouseenter'，function（）{（'＃select-product-reminder'）。show（）;
}）;

來源

2011-07-05 17:53:38 Rbacarin

MouseEnter上的簡單JQuery顯示問題

回答

相關問題