0

私はこれらのdivを持っています

<div id="fechaPartida">
            <label>Partida </label>
            <input type="text" class=".ui-icon-calendar dates" name="date" id="dateSV"  value="" /> 
        </div>
        <span id="hideit">
        <div id="fechaRegreso"> 
            <label>Regreso</label>
            <input type="text" class=".ui-icon-calendar dates" name="date" id="dateFV" value="" />
        </div>
        </span>
        <div id="soloIda">
            </br>
            <input type="checkbox" class="" name="" id="soloIdaCheck" value=""/> Solo ida
        </div>

スパン「hideit」でdivを隠して表示（切り替え）しています。それはうまくトグルします

$('#soloIdaCheck').click(function(){
        $('#hideit').toggle();

});

しかし、jqueryがtoggle('slow')を使用して提供するクールな効果が欲しいのですが、それを行うと、非表示にしたdivが最後のdivになるため、divの順序が変更されます

この画像をチェックして、理解を深めてください

ここに画像の説明を入力

これはdivのcssです

#fechas{
    width:100%;
    height:50px;
}

#fechaPartida{
    float:left;
    width:170px;
}
#hideit{
    display:inline-block;
}
#fechaRegreso{
    float:left;
    width:150px;
}
#soloIda{
    padding-top:5px;
    float:left;
    width:80px;
}
4

4 に答える 4

0

いくつかの小さなことを変更しただけです...私の場合は問題なく動作するようですが、これが役立つかどうかわかりませんか???

HTML

<div id="fechaPartida">
    <label>Partida</label>
    <input type="text" class=".ui-icon-calendar dates" name="date" id="dateSV" value="" />
</div>
<div id="fechaRegreso" class="hideit">
    <label>Regreso</label>
    <input type="text" class=".ui-icon-calendar dates" name="date" id="dateFV" value="" />
</div>
<div id="soloIda">
    <input type="checkbox" class="" name="" id="soloIdaCheck" value="" />Solo ida
</div>

JavaScript

$('#soloIdaCheck').click(function () {
    $('.hideit').toggle("slow");
});

CSS

#fechas {
    width:100%;
    height:50px;
}
#fechaPartida {
    float:left;
    width:170px;
}
#hideit {
    display:inline-block;
}
#fechaRegreso {
    float:left;
    width:150px;
}
#soloIda {
    padding-top:20px;
    margin-left:10px;
    float:left;
    width:80px;
}

編集:-申し訳ありませんが、他のコメントを読んでください。注文に問題はありません..私の悪い..DOH!!

于 2013-03-11T16:27:32.713 に答える
0

event.preventDefault()を使用できます。

説明: このメソッドが呼び出された場合、イベントのデフォルト アクションはトリガーされません。

$('#soloIdaCheck').click(function(){
        event.preventDefault();
        $('#hideit').toggle();    
});
于 2013-03-11T14:02:53.753 に答える
0

これは私が使用してうまくいくようです$('#hideit').toggle("slow");

http://jsfiddle.net/dazziep/EYbDd/

于 2013-03-11T14:06:32.947 に答える