ria-web
https://as5202t-5748.myasustor.com/
2026-07-05T11:26:28+00:00ria-web
https://as5202t-5748.myasustor.com/
https://as5202t-5748.myasustor.com/lib/exe/fetch.php?media=wiki:dokuwiki.svgtext/html2010-07-26T11:32:44+00:00Anonymous (anonymous@undisclosed.example.com)select
https://as5202t-5748.myasustor.com/doku.php?id=study:javascript:dojo:select&rev=1280143964&do=diff
Dynamic Select box from JSON
このページではツリー構造のリストをselectボックスで表示させて、さらにツリーの親子関係にあるselectボックスを連動
させる方法を説明する。
今回の例では、表示するデータをtext/html2016-05-20T06:21:38+00:00Anonymous (anonymous@undisclosed.example.com)monitor
https://as5202t-5748.myasustor.com/doku.php?id=study:javascript:jquery:plugin:monitor&rev=1463725298&do=diff
jQuery plugin for monitoring idle state
前に、dojoでidle stateを監視するクラスを作成してみたが、今回は同じソースをjQuery pluginで作成してみた。
plugin化するにあたって、optionの設定ができることと、activeステートとidleステートの際のcallbackメソッドをtext/html2021-03-03T01:30:09+00:00Anonymous (anonymous@undisclosed.example.com)select
https://as5202t-5748.myasustor.com/doku.php?id=study:javascript:jquery:select&rev=1614735009&do=diff
Append select option using jquery
jqueryを利用し、動的にoptionを作成する方法を紹介する。
まずはデモから見てみよう。
Test Page
<html>
<head>
<script type=“text/javascript” src=“./test/js/jquery-1.4.2.js”></script>
<script type=text/html2009-06-24T01:53:32+00:00Anonymous (anonymous@undisclosed.example.com)select_2
https://as5202t-5748.myasustor.com/doku.php?id=study:javascript:dojo:select_2&rev=1245808412&do=diff
set selectedIndex value for dynamic drop-down list
動的に作成されたselect objectのoptionを設定する方法を紹介する。
大まかに、動的にリストを作成する部分とoptionの値を設定する部分の二に分けて説明する。text/html2010-03-02T12:18:49+00:00Anonymous (anonymous@undisclosed.example.com)monitor
https://as5202t-5748.myasustor.com/doku.php?id=study:javascript:dojo:monitor&rev=1267532329&do=diff
Monitor idle state with custom events
최근 ajax 관련 project를 하면서, 유저가 동작을 멈췄는지 계속 조작하고 있는지 모니터링할 필요성이
제기되었다. 이런저런 궁리를 해도 생각되로 되지 않던 차에 Google 검색에서 그럴 듯한 것을 발견하였다.text/html2010-03-19T15:15:17+00:00Anonymous (anonymous@undisclosed.example.com)prevent_paste
https://as5202t-5748.myasustor.com/doku.php?id=study:javascript:dojo:prevent_paste&rev=1269011717&do=diff
Prevent paste operation in textfield
ユーザー登録画面とかでパスワードとかメールの確認の貼り付け(Ctrl+V)を防止したい時があると思う。
今回はその場面で役立つようなjavascriptコードを紹介する。text/html2008-03-20T01:51:20+00:00Anonymous (anonymous@undisclosed.example.com)event
https://as5202t-5748.myasustor.com/doku.php?id=study:javascript:event&rev=1205977880&do=diff
Mouse Cursor Position
document.compatMode
* Quirks mode[BACKCompat] : Standard-compliant mode is not switched on.
* Strict mode[CSS1Compat] : Standard-compliant mode is switched on.
function getPosition(e) {
e = e || window.event;
var cursor = {x:0, y:0};
if (e.pageX || e.pageY) {
cursor.x = e.pageX;
cursor.y = e.pageY;
}
else {
var de = document.documentElement;
var b = document.body;
cursor.x = e.clientX +
(de.sc…text/html2011-08-04T02:13:22+00:00Anonymous (anonymous@undisclosed.example.com)positioning
https://as5202t-5748.myasustor.com/doku.php?id=study:javascript:positioning&rev=1312424002&do=diff
Fixed Layer
Frame을 사용하지 않고 navigation이 고정된 채로 내용만 scroll되도록 만들어보자.
FireFox라면 position:fixed를 사용할 수 있겠지만, IE가 지원하지 않기 때문에
cross-browing을 생각하여 javascript와 css를 이용하여 구현해 보겠다.
간단하게 left navigation과 content두 column으로 구성된 page를 생각해보자.
css code snippet은 대략 다음과 같은 모습이다.text/html2008-04-23T04:13:08+00:00Anonymous (anonymous@undisclosed.example.com)mouse
https://as5202t-5748.myasustor.com/doku.php?id=study:javascript:event:mouse&rev=1208923988&do=diff
Popup the image on which a mouse is rolled over
mouseの位置を取るjavascriptを利用して、あるイメージをpopupさせる方法を紹介する。
簡単だから、コードを見ながら説明する。
function showPopUp(id, e) {
e = e || window.event;
var cursor = {x:0, y:0};
if (e.pageX || e.pageY) {
cursor.x = e.pageX;
cursor.y = e.pageY;
}else { //IE
var de = document.documentElement; //Strict Mode(offset=2,2)
var b = document.body; //Quirks Mode(offset=0,0)
cursor.x = e.clientX +
(de.scrollLeft ||…text/html2009-12-15T04:43:46+00:00Anonymous (anonymous@undisclosed.example.com)array
https://as5202t-5748.myasustor.com/doku.php?id=study:javascript:array&rev=1260852226&do=diff
Initialize an Array
1) Initialize the array when the load event is fired.
var initArray = [];
function init() {
var fE = document.forms['testForm'].elements;
for(var i = 0; i < 4; i++) {
initArray[i] = fE['field' + (i + 1)];
}
}//
2) Store the field names and look them up in your functionstext/html2011-09-22T04:15:48+00:00Anonymous (anonymous@undisclosed.example.com)debug
https://as5202t-5748.myasustor.com/doku.php?id=study:javascript:debug&rev=1316664948&do=diff
Display error messages of javascript
以下のコードでjavascriptソースの何行目でエラーが発生しているか分かります。
onerror=handleErr;
var txt="";
//debug function
function handleErr(msg,url,l)
{
txt="There was an error on this page.\n\n";
txt+="Error: " + msg + "\n";
txt+="URL: " + url + "\n";
txt+="Line: " + l + "\n\n";
txt+="Click OK to continue.\n\n";
alert(txt);
return true;
}text/html2017-11-28T04:26:41+00:00Anonymous (anonymous@undisclosed.example.com)clear-form
https://as5202t-5748.myasustor.com/doku.php?id=study:javascript:jquery:clear-form&rev=1511843201&do=diff
Clear form using jquery
jqueryを利用しFormのフィールドを初期化する方法を紹介する。
前提として、初期化するフィールドは以下に示す。
* input text
* select
* check box
* radio button
* textareatext/html2008-03-21T21:39:26+00:00Anonymous (anonymous@undisclosed.example.com)css
https://as5202t-5748.myasustor.com/doku.php?id=study:css&rev=1206135566&do=diff
Frame without frame
layer를 사용하여 Frame같은 효과를 내보자.
Identifying Your Sections
간단히 화면구성이 다음과 같다고 하자.
* left navigation
* righ tnavigation
* content
서두에서 얘기했듯이 table 포맷대신에 레이어를 사용하도록 한다.text/html2010-10-16T10:21:53+00:00Anonymous (anonymous@undisclosed.example.com)z-index
https://as5202t-5748.myasustor.com/doku.php?id=study:javascript:jquery:z-index&rev=1287224513&do=diff
Overlapping select field bug in IE 6
IE6ではselectタグ(Drop-down list)がDivレイヤーの上に、表示されるバグがある。
SelectタグをWindowsコントロールを使用して表示しているが、z-indexを無視するため、
selectタグが一番上に表示されることなのだ。