人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

当方、script等にはまったく持って初心者です。
以下の仕様のJavascriptが作りたいのですが、全然わからないのです・・・。

チェックボックスAとボタンAを押す・・・・1のリンク先へ
チェックボックスBとボタンAを押す・・・・2のリンク先へ
チェックボックスCとボタンAを押す・・・・3のリンク先へ
チェックボックスAとボタンBを押す・・・・4のリンク先へ
チェックボックスBとボタンBを押す・・・・5のリンク先へ
チェックボックスCとボタンBを押す・・・・6のリンク先へ

見た目的にはこんな感じです。
-------------------
□暇なときに回答ください
□困ってます
□すぐに回答ほしいです
[Aボタン][Bボタン]
-------------------
という感じです。
チェックボックスは複数選択する予定はありません。
(なので、チェックボックスではなく、ラジオボタンでも可です)。

チェックボックスを複数選択しない・・というとこへのツッコミはなしでお願いします^^;
何卒よろしくお願いいたします。

●質問者: rukineko
●カテゴリ:コンピュータ ウェブ制作
✍キーワード:JavaScript SCRIPT チェックボックス ツッコミ ボタン
○ 状態 :終了
└ 回答数 : 4/4件

▽最新の回答へ

1 ● ToMmY
●14ポイント

http://www.west-mira.jp/javascript/html/2/3/lec_10_get/get_check...

これの応用で可能です。

formのnameをform1

checkboxのnameをc1,c2,c3とします。

それぞれの移動先は、同ディレクトリのボタン、チェックボックスの順番で記述したページとします。

buttonは2つあり、それぞれonclickでそれぞれの関数を呼び出します。(button1>func button1 , button2 > func button2)

function button1()

{a=document.form1.c1.checked;

b=document.form1.c2.checked;

c=document.form1.c3.checked;

if(a==true){

setTimeout("location.href='./check11.html'",0);

}

if(b==true){

setTimeout("location.href='./check12.html'",0);

}

if(c==true){

setTimeout("location.href='./check13.html'",0);

}

function button2()

{a=document.form1.c1.checked;

b=document.form1.c2.checked;

c=document.form1.c3.checked;

if(a==true){

setTimeout("location.href='./check21.html'",0);

}

if(b==true){

setTimeout("location.href='./check22.html'",0);

}

if(c==true){

setTimeout("location.href='./check23.html'",0);

}

}

普段JSはかかないので、エラーチェックもしてません。エラーがでたら適当に直してください。

◎質問者からの返答

早速のご回答ありがとうございます。

当方初心者なもので少しわかりにくいです。。。申し訳ございません。

でも、ご回答くださったことに感謝いたします。


2 ● llusall
●0ポイント

サンプルです。

<html>

<head>

<script Language="JavaScript">

<!--

function goHatena()

{

    for (var i=0; i<3; i++){

        if (document.myFORM.elements[i].checked){ // どれがチェックされているか

            var ank = document.getElementById("link"+i); // アンカータグ取得

            document.location.href = ank.href; // 設定されているURLを取得

        }

    }

}

// -->

</script>

</head>

<body>

<form name="myFORM">

<input type="radio" name="type" CHECKED><a href="http://www.hatena.ne.jp/" id="link0">トップ</a><br>

<input type="radio" name="type"><a href="http://q.hatena.ne.jp/" id="link1">人力</a><br>

<input type="radio" name="type"><a href="http://hatenaquestion.g.hatena.ne.jp/" id="link2">ヘルプ</a><br>

<input type="button" value="GO" onClick="goHatena()"><br>

</form>

</body>

</html>

参考

JavaScript例文辞典

http://www.openspc2.org/reibun/javascript/form_radio/001/index.h...

http://www.openspc2.org/reibun/javascript/form_button/003/index....

getElementById

http://www.openspc2.org/JavaScript/ref/DOM/getElementById/index....


3 ● llusall
●29ポイント

※間違えました。こんな感じでしょうか?

前回のは開かないでいただけると助かります。


<html>

<head>

<script Language="JavaScript">

<!--

function goHatenaA()

{

    var aryUrl = new Array(7) ; 

    aryUrl[0] = "http://www.hatena.ne.jp/";

    aryUrl[1] = "http://q.hatena.ne.jp/";

    aryUrl[2] = "http://hatenaquestion.g.hatena.ne.jp/";

    for (var i=0; i<3; i++){

        if (document.myFORM.elements[i].checked){ // どれがチェックされているか

            document.location.href = aryUrl[i];

        }

    }

}

function goHatenaB()

{

    var aryUrl = new Array(7) ; 

    aryUrl[0] = "http://www.google.co.jp/";

    aryUrl[1] = "http://www.yahoo.co.jp/";

    aryUrl[2] = "http://jp.msn.com/";

    for (var i=0; i<3; i++){

        if (document.myFORM.elements[i].checked){ // どれがチェックされているか

            document.location.href = aryUrl[i];

        }

    }

}

// -->

</script>

</head>

<body>

<form name="myFORM">

<input type="radio" name="type" CHECKED>暇なときに回答ください ><br>

<input type="radio" name="type">困ってます <br>

<input type="radio" name="type">すぐに回答ほしいです><br>

<input type="button" value="Aボタン" onClick="goHatenaA()"><br>

<input type="button" value="Bボタン" onClick="goHatenaB()"><br>

</form>

</body>

</html>

参考 JavaScript例文辞典

http://www.openspc2.org/reibun/javascript/form_radio/001/index.h...

http://www.openspc2.org/reibun/javascript/form_button/003/index....

◎質問者からの返答

まさにこの形です。ありがとうございます。

再投稿ありがとうございました!


4 ● j_kimi
●47ポイント ベストアンサー

こんな感じではダメですか?

http://td200wr.zapto.org/html/work/test08.html

◎質問者からの返答

とてもわかりやすいソースをありがとうございます。

これならば私にでも項目増やしたりが簡単にできそうです!

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ