5

確かにこれには明らかな答えがありますが、私にはわかりません。JQuery を使用してページを動的にロードしています「ロードされた」ページには、 (HTML5).load()などのフォーム要素を含むフォームがあります。input type="number"

私がフォーム要素をslideToggle()した場合、フォーム要素が常に元に戻る理由はありますかinput type="text"? toggle()- (ちょうどtoggle())要素が「true」のままの場合toggle('slow')input type="text"

Ok。「page1」の HTML コードは次のようになります。

<form method="post" id="frmcreate">
<ol></ol>
<input type="submit" id="testit" />
</form>

このようにこれにロードされます-はい、doc ready() など。

$('ul#fieldtypes li a').click(function(){
var id_timestamp = new Date().getTime();
var id = $('.inputlength').length;
$( "#frmcreate ol" ).append('<li id='+id_timestamp+' class="inputlength"></li>');
$('#'+id_timestamp).load('test1.php?y='+id);
return false;

});

これはロードされるフォームです

Type <input type="text" name="fieldmeta<?php echo $y; ?>[type]" /> <?php echo $error; ?> 
<br/>
Name <input type="text" name="fieldmeta<?php echo $y; ?>[name]" value="<?php echo $y; ?>" /> <?php echo $error; ?> 
<br/>
<div class="optoggle">OPTIONS</div>

これらは、別のページからロードされた「オプション」です。

<li>Cols<input type="number" name="fieldmeta<?php echo $y; ?>[cols]" /> <?php echo $error; ?></li>
<li>Rows<input type="number" name="fieldmeta<?php echo $y; ?>[rows]" /> <?php echo $error; ?></li>
<li>Size<input type="number" name="fieldmeta<?php echo $y; ?>[size]" /> <?php echo $error; ?></li>

それらは次のようにロードされます。

$('.optoggle').live('click',function(){
    $(this).next('div').toggle();
});
4

3 に答える 3

1

@jwegner が指摘したように、あなたの問題は jQuery にあるのではなく、ブラウザーが HTML5 をサポートしていることにあります。

再開します。現在、Google Chrome だけが<input type="number" />. 「唯一」というのは、最終版にあるからです。Firefox 4 と Internet Explorer 9 の両方がこの属性を理解することを約束していますが、現在はベータ版または RC 版であり、検討することはできません。

指摘されたように、Chrome にはバグがあります。親がアニメーション化されている場合、数値フィールドの子の矢印は非表示のままです。入力にフォーカスしてキーボードの矢印を使用すると、数値フィールドとして機能することがわかります。「ただ」見た目がおかしい。

toggle()親がアニメーション化されていないため、これは発生しません。非表示になり、再び表示されるだけです。しかしtoggle("slow")、アニメーションが発生すると、説明されているバグも発生します。

ここに回避策を投稿しました:http://jsfiddle.net/4fBvL/2/、これに基づいています:スライドアウトするとき、アニメーションを使用できます。しかし、再び現れるには、すぐにでなければなりません

別の回避策は、 and の代わりに and を使用fadeIn()するfadeOut()ことslideUp()ですslideDown()。何らかの理由で、フェードはバグを引き起こしません。

とにかく、type="number"今のところ避けるのが最善の選択肢です。結局のところ、自分のページを Chrome だけで動作させたくありませんよね?

于 2011-03-14T14:35:34.863 に答える
0

あなたの問題は物事の組み合わせのようです。

問題を表示するのに役立つこの更新されたフィドルを作成しました:http://jsfiddle.net/KmMBd/10/

FirefoxとIEでは、Chrisはまさにその通りです。Firefoxは「数値」タイプをサポートしていないため、常に「テキスト」として扱います。フィドルをロードしてアラートを押すと、「テキスト」が表示されます。明らかにこれは正しくありませんが、Firefoxは「数値」タイプの処理方法を知りません。firebugの入力ボックスを調べると、実際にはtype = "number"と表示されており、警告が間違っていることがわかります。この動作は、どのような種類のトグルまたはスライドトグルを実行しても当てはまります。

Chromeではバグのように見えます。HTML5はまだ公式の標準ではないことを考えると、これは理解でき、バグレポートの素晴らしい機会です。Chromeは、再描画するときに数値タイプを正しくレンダリングしないようです。フィドルでは、slideToggle 1、次にslideToggle 2を押すと、ナンバースピナーが戻ってきます。これは私がそれを再描画することの問題であると私に思わせるものです-子供/親のものの何か、私は賭けます。このリンクには、Chromeのバグの報告に関する情報があります:Chromeのバグを報告する

サファリでは、問題は少し異なります。数値タイプはサポートされていますが、実際には処理されません。つまり、Safariは入力が「テキスト」ボックスとは異なることを認識しますが、実際にはその情報に対して何もしません。基本的に、SafariはFirefox/IEと同じように扱います。

要するに、あなたの問題に対する本当の答えは、今のところ数字の入力を避けることだと思います。ほとんどのブラウザ(1つだけ)ではサポートされておらず、サポートされているブラウザ(実際にはChromeだけ)ではバグがあります。しばらくお待ちください-HTML5はすぐに素晴らしいものになります:)

于 2011-02-28T04:34:55.463 に答える
0

FF(3.6.13)では「テキスト」、Chromeでは「番号」を警告します。FFは「数値」タイプを認識していないため、デフォルトの「テキスト」に戻ります。

于 2011-02-20T16:50:16.837 に答える