HTMLチェックボックスのon/offの取得
とりあえず、
<input type="checkbox" id="id1">one <input type="checkbox" id="id2">two
といった風に、id付けしたHTMLに対して、
if( $('id1').checked ){ //... }
のようにcheckedでtrue/falseが取得できる。
他にスマートな方法がありそうですが。
serial型の数え上げ
1からでした。0じゃないのね。
テーブルのセルを「編集ボックス」と「値の表示」で入れ替えられるようにする
要ははてなグラフみたいな事がしたかった訳です。
http://d.hatena.ne.jp/kcha/20080619/1213854498の改善版です。
前回のコードは色々と間抜け
だと自分でも思います。最初から「編集」の領域と、「表示」の領域の2つをdivで入れておいて、片方のstyle属性をdisplay:noneしておけば簡単だったのに。
まずは指定箇所のHTMLコード。(必要な箇所しか書きません)
<table> <tr> <td> <div id="value" onclick="Up();">123</div> <div id="input" style="display:none;"> <form style="display:inline;"> <input type="text" id="text" value="123" onblur="Down();"> </form> </div> </td> </tr> </table>
んでjavascriptはこう。
function Up(){ $("value").style.display = "none"; $("input").style.display = "inline"; $("text").select(); } function Down(){ $("value").innerHTML = $("text").value; $("value").style.display = "inline"; $("input").style.display = "none"; }
HTML側のformタグですが、style属性にdisplay:inlineを打っておく必要がありました。でないと、入力欄が出た際に下方向に拡張されてしまいます。(IEでしか確認してませんが)
あいかわらずCSSの勉強が未だです。はよやらんと。
XMLHTTPRequestリファレンス
いままでリファレンスではなく、サンプルばかりを見てAjaxコードを組んでいたので、メモ。
MSDNのものと、
IXMLHTTPRequest | Microsoft Docs
W3Cのもの。
XMLHttpRequest Level 1
あと、恐らく標準に準拠しているであろう(まだよく見ていない)Google Codeがあったので、これもメモしておく。
http://code.google.com/p/xmlhttprequest/
テーブルのセルを入力欄を入力値の表示で切り替える
コードを書いてみました。セル(というか数値)をクリックすると入力欄に切り替わり、フォーカスを外すとその時の値で確定します。
が、何か格好悪い。
もっとスマートな方法がありそうですが。
<html> <head> <script type="text/javascript"><!-- function InputUp(cell){ var valueCell = cell + "-value"; var inputCell = cell + "-input"; var text = document.getElementById(valueCell).innerHTML; document.getElementById(valueCell).innerHTML = ''; var text = '<input type="text" id="input_area" onblur="InputDown(\'' + cell+ '\');" value="' + text + '">'; //window.alert(text); document.getElementById(inputCell).innerHTML = text; document.getElementById("input_area").focus(); } function InputDown(cell){ var valueCell = cell + "-value"; var inputCell = cell + "-input"; var text = document.getElementById("input_area").value; document.getElementById(inputCell).innerHTML = ''; document.getElementById(valueCell).innerHTML = text; } //--></script> </head> <body> <table border="1" cellspacing="1"> <tbody> <tr> <td> <span id="1-1-value" onclick="InputUp('1-1');">12</span><span id="1-1-input"></span> </td> <td> <span id="1-2-value" onclick="InputUp('1-2');">12</span><span id="1-2-input"></span> </td> </tr> </tbody> </table> </body> </html>
あと、入力値を空で確定すると、領域(幅?)がなくなるので次回の編集に入れなくなる。
cssきちんとして、幅を取ればいいのだろうけど。
追記
パラグラフ単位でこのエントリを見ようとすると、javascript部分が消えるようです。日付単位で閲覧してください。
passしました。その弐。
UMTPのL1-T1を受験した後、早一ヶ月。
UMLの試験(UMTP)のL1-T2を受験してきました。
これでようやくLevel1のロゴが使用できます。(右上の小さな画像がそうです。)
さあ、次はLevel2かな。
Automation、昨日の続き
http://d.hatena.ne.jp/kcha/20080604/1212569893の続きです。
とりあえず、適当にVB2005で叩いてみた。NUnitをリンクしていないので、SetUpとTearDownも一連の動作としてつっこんであります。
Imports System.Windows.Automation Module Module1 Sub Main() Dim path As String = "..\..\..\UITest01\bin\Debug\UITest01.exe" Dim app As Process = Process.Start(path) System.Threading.Thread.Sleep(1000) Dim aeForm As AutomationElement = AutomationElement.FromHandle(app.MainWindowHandle) Dim textInput As AutomationElement = FindElement(aeForm, "TextBoxInput") Dim buttonAdd As AutomationElement = FindElement(aeForm, "ButtonAdd") Dim listbox As AutomationElement = FindElement(aeForm, "ListBoxOutput") '操作対象のコントロール・パターンを取得 Dim vpTxtInput As ValuePattern = _ CType(textInput.GetCurrentPattern(ValuePattern.Pattern), ValuePattern) Dim ipBtnAdd As InvokePattern = _ CType(buttonAdd.GetCurrentPattern(InvokePattern.Pattern), InvokePattern) '一つ目の値を入力、追加ボタンを押下 vpTxtInput.SetValue("わっち") ipBtnAdd.Invoke() '二つ目の値を入力、追加ボタンを押下 vpTxtInput.SetValue("おおかみ") ipBtnAdd.Invoke() '三つ目の値を入力、追加ボタンを押下 vpTxtInput.SetValue("萌え") ipBtnAdd.Invoke() 'リストボックスの値を取得するため 'AutomationElementCollectionオブジェクトを取得 Dim aecListItems As AutomationElementCollection = _ listbox.FindAll(TreeScope.Children, _ New PropertyCondition(AutomationElement.ControlTypeProperty, ControlType.ListItem)) If Not "わっち" = aecListItems(0).Current.Name Then Console.WriteLine("一つ目の値") End If If Not "おおかみ" = aecListItems(1).Current.Name Then Console.WriteLine("二つ目の値") End If If Not "萌え" = aecListItems(2).Current.Name Then Console.WriteLine("三つ目の値") End If If Not 3 = aecListItems.Count Then Console.WriteLine("追加されたアイテム数") End If 'teardown Dim wpForm As WindowPattern = CType(aeForm.GetCurrentPattern(WindowPattern.Pattern), WindowPattern) wpForm.Close() End Sub Public Function FindElement(ByRef rootElement As AutomationElement, _ ByVal automationID As String) As AutomationElement Dim element As AutomationElement = _ rootElement.FindFirst(TreeScope.Element + TreeScope.Descendants, _ New PropertyCondition(AutomationElement.AutomationIdProperty, automationID)) Return element End Function End Module