JQuery slide Toggleの問題

Question

これには明らかな答えがありますが、わかりません。私は動的にJQueryを使用してページをロードしています​​"ロードされた"ページにフォーム要素を持つフォームがあります。 input type="number"（HTML5） （ちょうどtoggle()）の要素Iが追加同様にあれば「真」のままtoggle('slow')フォーム要素常に戻す -

I slideToggle（）I toggle()があれば、フォーム要素は、常にまだ戻っinput type="text"に戻す形があれば、なぜ何らかの理由があります〜input type="text"

"ページ1" にHTMLコードは次のようになります。

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

それは次のようにこれにロードされる - はいドキュメントの準備ができて（）など

$('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(); 
}); 

Answer 1

オンFF（3.6.13）はChromeの「番号」に「テキスト」を警告します。 FFは、テキスト 『「それはのデフォルトに戻ります』「数」タイプを知らないと思います。

Answer 2

をあなたの問題は、物事の組み合わせであるように見えます。

私は助けるために、この更新フィドルを作成しましたhttp://jsfiddle.net/KmMBd/10/

Firefoxは、「数字」タイプをサポートしていないので、常に「テキスト」として扱います。明らかにこれは間違っていますが、firefoxは "number"型の扱い方を知らないのですが、firebugの入力ボックスを調べると、実際にはtype = "number"警告だけが間違っています。あなたがどんなトグルや滑り止めをしても真実です。

クロムではバグのようです。 HTML5が公式の標準ではないことを考えると、これは理解でき、バグレポートの素晴らしい機会です。 Chromeは、番号のタイプを再描画するときに正しく表示されないようです。フィドルでは、あなたがスライドトグル1、スライドトグル2の場合、スピンナーが戻ってきます。これは、私がそれを再描画する際の問題だと思うようにしています - 子供/親のものを持つもの、私は賭けました。このリンクには、Chromeのバグの報告に関する情報があります。Report Chrome Bugs

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

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

Answer 3

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

今日、再開するGoogle Chromeは、<input type="number" />を理解する唯一のものです。私は「唯一の」というのは最終版であるからです。 Firefox 4とInternet Explorer 9は、この属性を理解することを約束していますが、今はベータ版やRC版であるため、考慮することはできません。

同様に、Chromeにはバグがあります。：親がアニメーション化されている場合、数字フィールドの子供の矢印は非表示のままです。あなたの入力に焦点を当て、キーボードの矢印を使用すると、まだ数字フィールドとして機能していることがわかります。 「ちょっと」外観が間違っています。

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

http://jsfiddle.net/4fBvL/2/これをベースにしています：スライドアウトすると、アニメーションを使用できます。しかし、再び表示するには、それはimediatellyでなければなりません。

もう1つの回避策はslideUp()とslideDown()の代わりにfadeIn()と​​を使用することです。なんらかの理由でfadesが原因でバグが発生しません。

とにかく、最良の選択肢は今はtype="number"を避けることです。結局のところ、あなたのページはChromeでのみ動作するようにはしませんか？