▼ pass1 開始 ボタンと pass2 開始 ボタンをクリックして下さい。
------------------------------
class 属性を使用して、会話グループ単位に使用可能にしたり使用不能にしたりします
<script type="text/javascript">
function passControl(idstr,pass,enable) {
var x = window[idstr];
for( var i = 0; i < x.length; i++ ) {
if ( x[i].className == pass ) {
if ( (x[i].tagName).toUpperCase() == 'INPUT' ) {
if ( (x[i].type).toUpperCase() == 'TEXT' ) {
if ( enable ) {
x[i].readOnly = false;
x[i].style.backgroundColor = "#DCF2F5";
}
else {
x[i].readOnly = true;
x[i].style.backgroundColor = "#ccc";
}
}
if ( (x[i].type).toUpperCase() == 'BUTTON' ) {
if ( enable ) {
x[i].disabled = false;
}
else {
x[i].disabled = true;
}
}
}
if ( (x[i].tagName).toUpperCase() == 'TEXTAREA' ) {
if ( enable ) {
x[i].readOnly = false;
x[i].style.backgroundColor = "#DCF2F5";
}
else {
x[i].readOnly = true;
x[i].style.backgroundColor = "#ccc";
}
}
if ( (x[i].tagName).toUpperCase() == 'SELECT' ) {
if ( enable ) {
x[i].disabled = false;
}
else {
x[i].disabled = true;
}
}
}
}
}
function getFormEntry(idstr) {
// 親要素
var js_form = document.getElementById(idstr);
// 配列
var arr = new Array();
// input
var wk = js_form.getElementsByTagName("input");
for( i = 0; i < wk.length; i++ ) {
arr.push( wk[i] );
}
// textarea
var wk = js_form.getElementsByTagName("textarea");
for( i = 0; i < wk.length; i++ ) {
arr.push( wk[i] );
}
// select
var wk = js_form.getElementsByTagName("select");
for( i = 0; i < wk.length; i++ ) {
arr.push( wk[i] );
}
window[idstr] = arr;
console.dir( window[idstr] );
}
</script>
<style type="text/css">
#js_form2 {
width: 400px;
padding: 20px;
border: 1px solid #888;
border-radius: 10px;
}
</style>
<input type="button" value="pass1 開始" onclick='passControl("js_form2","pass1",true);passControl("js_form2","pass2",false)'>
<input type="button" value="pass2 開始" onclick='passControl("js_form2","pass1",false);passControl("js_form2","pass2",true)'>
<br><br>
<pre id="js_form2">
<input type="text" id="in01" class="pass1"> <input type="button" id="bt01" value="第１会話ボタン" class="pass1">
------------------------------
<input type="text" id="in02" class="pass2">
<input type="text" id="in03" class="pass2">
<textarea id="tx01" class="pass2"></textarea>
<select id="cb01" class="pass2">
<option value="001">001</option>
<option value="002">002</option>
</select>
<input type="button" id="bt02" value="第２会話ボタン" class="pass2">
</pre>
<script type="text/javascript">
getFormEntry("js_form2");
</script>
関連する記事 JavaScript による２会話アプリケーションのコントロール(1)
|
|
【JavaScriptの最新記事】
- Replit : js-web-speech
- JavaScript の論理和(||) による『無かった場合の値の代入』/ expr1 || expr2 は expr1 を false と見ることができる場合は expr2 を返します
- Seesaa の記事に下の『最新の同カテゴリのリスト』のリンクの最後に付く ?seesaa_related=category を削除する方法
- JavaScript : ブラウザ判定( IE11 対応 ) / edge を追加
- JavaScript : 入力文字列を 変数用16進数表現 に変換する
- JavaScript : 入力文字列を htmlentity に変換する
- HTML5 で行われる入力チェックを :invalid :valid 疑似クラスと JavaScript を使用してリアルタイムにエラーを視認させる
- HTML5 で行われる入力チェックのエラーメッセージをカスタマイズする JavaScript の記述( この手のコントロールはとてもデリケートです。いろいろなパターン検証が必要です )
- テーブルのセルをクリックして背景色を rgb(0,0,0) から #000000 の変換で、eval を使う事の考察
- JavaScript & VBScript : ブラウザから Windows の OS のバージョンを判定
- Firefox、IE11 の canvas で動作する楕円( ellipse )関数
- 文字列を UTF-8(２バイト以上) で表現した時の 16進数表現の文字列を取得する
- ブログで jQuery を使用するのに、全ての記事で使うわけでは無いので、記事毎でロードする
- JavaScript による２会話アプリケーションのコントロール(1)
- JavaScript : Global な undefined 変数に絡むいろいろ
- 簡易縦書き変換
- ブラウザの WebGL チェック : jQuery 名前空間へ変数($.is_webgl)追加
- JSONP の原理と、簡単な利用方法の実際のコード( 実装は jQuery が良いですが、Access-Control-Allow-Origin: * のほうが楽だし読込み先を制限できます )
- document.createElement("a") で新しいウインドウ(タブ)を開く
- JavaScript と VBScript のカラーコード(#RRGGBB)の文字列と数値間の相互変換
