Javascript勉強中です。
よろしくお願いします。

以下のは親ウインドウから小ウインドウ開いたときに小ウインドウで好きなデータを選択して親ウインドウに自動入力させたい物の小ウインドウソースです。
ただこれですと常にform1のデータが親ウインドウのに戻ってしまいますのでおそらく区別出来る設定有ると思うのですが調べてもわかりませんでしたので書かせて頂きました。
よろしくお願いします。
※特にこの形式にこだわっている感じでもなく小ウインドウから複数データからそれぞれのデータ選択で親ウインドウに自動入力できれば大丈夫です。

<html>
<head>
<script Language="JavaScript"><!--
function setData() {
window.opener.frm1.box1.value = document.getElementById("input1").value;
window.opener.frm1.box2.value = document.getElementById("input2").value;
window.close();
}
// --></script>
</head>
<body>
<form name="form1">
<input type="text" id="input1" value="222"><br>
<input type="text" id="input2" value="222"><br>
<input type="button" onclick="setData()">
</form>
<form name="form2">
<input type="text" id="input1" value="333"><br>
<input type="text" id="input2" value="333"><br>
<input type="button" onclick="setData()">
</form>
</body>
</html>

質問者からの補足コメント

  • 画像URLですが
    &(アンド)が自動変換されててエラーが出てますのでURLのアンドを小文字に書き換えて下さい。
    http://or2.mobi/index.php?mode=image&file=153778.jpg

    No.2の回答に寄せられた補足コメントです。 補足日時:2017/04/19 11:13

A 回答 (2件)

ANo1です。



>よろしくお願いします。
うまくいかない理由は、すでにANo1に記したつもりなのですが・・・?

補足を読んでも、相変わらずさっぱりわかりませんけれど、ご提示のHTMLは基本的にそのままにすることとして、とりあえずこんな方法でも、取得なさりたい値は取れるのではないかと思います。
(補足を読む限りでは、input[type=text]でもなさそうな気がしますし、子ウィンドウの必要性もあるのかなとか…
また、ご質問とは関係ないけど、「名前や電話番号」って・・・)

※ 親文書の構成が不明なのでalert表示までとしています。
※ 処理に必要ないid等は省いてあります。

<!DOCTYPE HTML>
<html lang="ja">
<head><title>Sample</title>

<script type="text/javascript">
document.addEventListener("click", function(e){
var inp, t = e.target;
if(t.nodeName != "INPUT" || t.type != "button") return;
inp = t.parentNode.querySelectorAll("input");

// 親文書が不明なので値の表示のみ
alert("Values are " + inp[0].value + " and " + inp[1].value);

}, false);
</script>
</head>

<body>

<form>
<input type="text" value="222" /><br />
<input type="text" value="222" /><br />
<input type="button" />
</form>
<form>
<input type="text" value="333" /><br />
<input type="text" value="333" /><br />
<input type="button" />
</form>

</body>
</html>
この回答への補足あり
    • good
    • 0
この回答へのお礼

書き込みありがとう御座います。
説明下手で申し訳ありません、頂いた方法で対応は出来そうなので使わせて頂きたいと思います。
一応やりたいこともは以下のURLに写真をアップロードしたのですが親ウインドウにユーザー情報を入力する箇所があり、小ウインドウから登録済みのユーザー情報を選択して自動入力出来たらと思ってました。
http://or2.mobi/index.php?mode=image&file=153778 …

お礼日時:2017/04/19 11:09

こんにちは



実際には何をなさりたいのかよくわかりませんが、それはおいておくとして・・・

値を取得するのに
>document.getElementById("input1").value
>document.getElementById("input2").value
などとしていますが、ご提示のHTML文書には同じidの要素が複数あります。
(idは本来一意のはずなので、構文違反といえます)

エラーとなってもおかしくはないのですが、大半のブラウザは最初にある該当要素(=ご提示の場合、form1内のinput要素)を対象とするようです。
このあたりをきちんと識別できるようにしてあげれば、解決できるのではないでしょうか?

>特にこの形式にこだわっている感じでもなく~~
であるなら、input要素の内容はユーザが入力可能なので、form自体を一つにしてしまえば問題はなくなるのではないかと思いますが・・・?


ついでながら…
最近のブラウザではquerySelectorが利用できますので、必ずしもidやクラスを個々の要素に振らなくても、比較的簡単に要素を指定することは可能です。
https://developer.mozilla.org/ja/docs/Web/API/El …

また、ご提示のスクリプトで、一方では、
>document.getElementById("input1")
という指定の方法をとっているのに対して、他方では、
>window.opener.frm1.box1
という方法なのも、なんだかアンバランスさを感じるところです…
    • good
    • 0
この回答へのお礼

fujillin様
書き込みありがとう御座います。
やりたい事は小ウインドウでユーザー情報一覧が表示されて選択したユーザーだけの情報が親ウインドウに自動入力させたいものです。
ですので複数ユーザーが小ウインドウに表示される場合は、名前、電話番号などほぼ同じ項目が繰り返しとなります、ですのであえてFormわけして同じ名前にしました。
よろしくお願いします。

お礼日時:2017/04/18 18:15

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人はこんなQ&Aも見ています

このQ&Aと関連する良く見られている質問

Q

<input type="hidden" name = "hoge">があったとします。
これを、javascriptを使用し nameで検索します。
”hoge”を検索後、その”hoge”という名前を変更する方法を探しています。 

<input type="hidden" name = "hoge">
       ↓↓↓↓↓
<input type="hidden" name = "fuga"> 

リフレッシュ無しで、上記のようにnameを変える方法が知りたいです。

ご存知の方おりましたら、お手数ですが教えていただけませんでしょうか。
宜しくお願いいたします。

Aベストアンサー

タグが特定出来れば、setAttribute等で属性値を変更出来ます。
setAttribute("name","fuga")

Qで、Q1に後で値を設定して表示するには

お世話になります。
<input type="text" name="Q1">で、Q1に後で値を設定して表示するにはどうしたら良いものでしょうか。
name="Q1"
と、しているので、
onMousedown="function()"
で、nameでしてしたエリアに値を書き込めば、できると思うのですが、
このfunction()をどのように書いたらよいものか、いろいろ調べてもわかりません。
何とかご教示願えないでしょうか。
よろしくお願いします。

Aベストアンサー

javascriptを利用することで出来ます。
こんな感じで動くでしょう。
ちなみにテキストボックスなどをjavascriptで操作する場合は
idをつけておくと便利です。

これ以上をやりたいというのであれば
参考URLなど見て勉強してみてください
<html>
<head>

</head>
<body>

<input type="text" id="Q1" name="Q1" onmousedown="hoge()">
</body>
<script type='text/javascript'>
function hoge()
{
Q1.value = ""; //""のなかに設定する値
}
</script>

参考URL:http://www.parkcity.ne.jp/~chaichan/src/javasc21.htm

Q

▼次のようにページ内のdivタグのidの名前によって、formタグ内の要素をdisableにすることはJava scriptによって可能でしょうか?

<div id="AA">のとき、別の場所にある<form id="BB">内のselect要素などすべての要素をdisableにする。

また同時に、id="BB"に指定したスタイルシートの記述を書き換えることは可能でしょうか?

何かよい方法をご存知でしたら教えてください。よろしくお願いいたします。

Aベストアンサー

>なぜか時々エラーが出ます。
ウチでちょっと試した程度ではエラーが発生しませんでした。
できましたら、発生したときのメッセージや場所また、ブラウザの種類なども教えてください。

以下は、予防的な意味での注意点についてちょっと書きます。
>return false;

は、必要ないです。
書かない方がいいと思います。
==nullの場合の処理が必要ないなら
!=nullにすればよいです。
もしくは
return false;でなくて
;
のように空文でもよいです。
あと、idに使っている名前と同じ名前を変数名として使わない方が良いです。
つまり、
id="soldout"の時に
var soldout;という風にはしない方が良いです。
同じでなければ、cartFormでもなんでもかまいません。
あと、scriptは、
<!--
(スクリプトの中身)
//-->
のように
<!--
//-->
で囲むようにします。

getElementById
は、ブラウザやのブラウザのバージョンによっては使えないことがあります。
その場合は、使えるかどうかを調べる必要があります。

<script type="text/javascript">
<!--
function stockStatus (num){
var f=document.getElementById("soldout");

if(f!=null){
for (var i =0; i<=f.length -1 ;i++){
f.elements[i].disabled=num;
}
}
}
//-->
</script>

>なぜか時々エラーが出ます。
ウチでちょっと試した程度ではエラーが発生しませんでした。
できましたら、発生したときのメッセージや場所また、ブラウザの種類なども教えてください。

以下は、予防的な意味での注意点についてちょっと書きます。
>return false;

は、必要ないです。
書かない方がいいと思います。
==nullの場合の処理が必要ないなら
!=nullにすればよいです。
もしくは
return false;でなくて
;
のように空文でもよいです。
あと、idに使っている名前と同じ名前を変数名として...続きを読む

Q

に文字列をセットするために

<form>
<input type="file" id="x"/>
</form>
<input type="button" onclick="f()" value="push"/>
<script>
function f()
{
var e=document.getElementById("x");
e.value="x.txt";
}
</script>

としてもセットできません

<form>
<input type="text" id="x"/>
</form>
<input type="button" onclick="f()" value="push"/>
<script>
function f()
{
var e=document.getElementById("x");
e.value="x.txt";
}
</script>

であればセットできるのです
どうしたらセットできるでしょうか?

Aベストアンサー

Minefield 3.0a1で実験を行いました。
おっしゃる状況が再現できました。

参照クリック後のinput要素のvalue値を調べた時は問題なさそうだったので

Console2を用いてエラーを見てみたところ
エラー: Security error = NS_ERROR_DOM_SECURITY_ERR

と、セキュリティ上の理由からエラーが出ているようでした。多分仕様だと思います。

ところで...補足要求。
【何がしたくて】これを行いたいのでしょう?


このQ&Aを見た人がよく見るQ&A

人気Q&Aランキング

おすすめ情報