1

私は独学でjQueryを学んでおり、これを理解しようと楽しんでいます。slideDownと関数を使用して、必要に応じslideUpて異なる を<div>表示および非表示にしています。しかし、私の問題は削除にあります。選択したさまざまなオプションを個別に表示することはできますが、<div>の 1 つだけを削除しようとしたときに両方の が表示されている場合<div>、両方<div>の がすばやく点滅し、両方とも消えます。の 1 つだけが表示されている場合にも発生し<div>ます。削除リンクをクリックすると、両方<div>が素早く点滅して消えます。私は本当に理由についての手がかりを持っていません。このコードの背後にある考え方は、ユーザーが必要に応じて追加および削除できるようにすることです。誤って選択した場合、ユーザーはそれを削除できますが、以前に選択された他の選択は表示されたままです。これが私のコードです：

<div class="type-select" style="width:400px;">
<select name="selectStatus">
<option selected value="Select">Select...</option>
<option id="login">Login</option>
<option id="nav">Navigation</option>
</select></div>
<div id="loginselect"><img src="http://triplemsystems.ekkosolutions.com/images/global/bg-loginPages.gif" height="47" width="162" />
<a id="remove" href="">Remove</a></div>
<div id="navselect"><img src="http://triplemsystems.ekkosolutions.com/images/global/bg-navMain.gif" height="45" width="90"/>
<a id="removenav" href="">Remove</a></div>
<script>
$("#loginselect").hide("fast");
$("select").change(function(){
    if($("#login").is(":selected")){ 
        $("#loginselect").slideDown("slow");}
});
$("#remove").click(function() {
    $("#loginselect").slideUp("slow");
});

$("#navselect").hide("fast");
$("select").change(function () {
    if($("#nav").is(":selected")){
        $("#navselect").slideDown("slow");}
});

$("#removenav").click(function() {
    $("#navselect").slideUp("slow");});

</script>

私は正しい道を進んでいますか？

4

1 に答える 1

1

あなたは正しい道を進んでいます。問題は、リンクのデフォルトのアクションを妨げていないため、ページが更新されていることだと思います（divsが1秒間表示されます）。eventパラメータを受け入れて呼び出すことにより、リンクのデフォルトのアクションを防ぐことができます.preventDefault()。

$("#remove").click(function(e) {
    e.preventDefault();
    $("#loginselect").slideUp("slow");
});

ここで動作しています：http：//jsfiddle.net/XzDzb/

于 2011-06-29T22:45:36.297 に答える