※ ChatGPTを利用し、要約された質問です(原文:変数内容をHTML内で表示する方法)
変数内容をHTML内で表示する方法
このQ&Aのポイント
javascript初心者のため、perlからの変数の取り扱い方に困っている。特に、HTML内で変数の内容を表示する方法を知りたい。
質問者はjavascriptの変数(msg)の内容をHTMLタグ内で表示させたいが、うまくいかない。
質問者はajaxを使ってperlとのデータのやり取りをしようとしているが、perlの変数の扱い方とjavascriptの変数の扱い方が異なるため、困っている。具体的には、HTML内で変数(msg)の内容を表示する方法を知りたい。
javascript初心者です(主にはperlを使っています)。
ajaxに手をだしたところ、perlとの変数の取り扱い方が基本的なところで違っていて戸惑っています。
例えばperlの場合、タグ内の変数(例えば$msg)は、ホームページで表示する際は、その内容が展開表示されるので、
javascriptでも、変数(例えばmsg)を、それと同様に扱ったところ、全く展開表示されずに困っています。
javascriptで変数(例えばmsg)の内容を、htmlタグ内で表示させるには、どうしたらよいのか教えて下さい。
(あれこれ検索してみましたが、何故か、その方法が見つかりませんでした)
具体的には、、、、、
(以下のソース参照)
「チェック」ボタンをクリックしたら、それをきっかけにして、外部プログラムが起動し
そこからの返答として、javascriptの変数msgの中に
「exist」もしくは「noexist」が代入されて返ってきます。
それに基づき、javascriptの変数 resultの中に「有 msg」又は「無 msg」が代入され、
それが、<div id="note$id"></div>の部分に表示されます。
が、その際、変数msgの内容を表示させたいのですが、それができません。
例えば
result = '有 document.write(msg);';
とやったのですが、それでも表示されません。
msgの内容をHTMLタグ内で表示させる方法を教えて下さい。
よろしくお願いします。
---------------------------------------------
実際のソース(肝心な部分だけを抽出)
---------------------------------------------
<header部分>
<!-- JQuery -->
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript">
<!--
// When DOM is ready
$(document).ready(function(){
// ------- Form -------
$("input").click(function(){
id2= $(this).attr("class");
sharpform="#form";
sharpfields="#fields";
sharpnote="#note";
formid = sharpform + id2;
fieldsid= sharpfields + id2;
noteid= sharpnote + id2;
$(formid).submit(function() {
var str = $(this).serialize();
$.ajax({
type: "POST",
url: "./外部ブログラム名.cgi",
data: str,
success: function(msg) {
// Message Sent? Show the 'Thank You' message and hide the form
if(msg == 'exist') {
result = '有 msg';
$(fieldsid).hide();
} else if(msg == 'noexist') {
result = "無 msg";
$(fieldsid).hide();
} else {
result = msg;
}
$(noteid).html(result);
}
});
return false;
});
});
});
-->
</script>
---------------------------------------------
<body部分>
<div id="note$id"></div>
<div id="fields$id">
<form id="form$id" method="post" action="">
<input type="hidden" name="method" value="post">
<input type="hidden" name="check" value="$check">
<input type="submit" value="チェック" class="$id"/>
</form>
</div>
※html表示時には、$idには、1や2等の数字が入って表示されます。
---------------------------------------------
お礼
ええ!? 半日悩んだ難問(笑)の答えが、たったそれだけ? まさか、そんな、、、、、、、と半信半疑(笑)思って試してみたら、、、、、 yuu_x様、、、、大変ありがとございました。 バッチリ表示されました。 相談して正解でした。 perlの発想から頭がなかなか抜け出せないようで、相談しなかったら、永久に解けない難問でありつづけたと思います。 本当に回答、ありがとうございました。