リンク先アドレスの一部にテキストボックスの値を代入させる方法。

ホームページのリンクボタンを作りたいのですが、テキストボックスに入力した値をURLの一部として表示させる方法が分からなくなって、質問致しました。

例えば固定のアドレスを　http://www.hoge.com/　にして、テキストボックスに「123456」と入力すれば、

リンクボタンを押した時

http://www.hoge.com/123456/

という様に表示させたいのです。

検索でも色々調べてみたのですが、ヒントになりそうなページがヒットせず、自分なりには下の様に作ったのですが、うまく作動しません。
何か方法がありませんでしょうか。ご教示下さい。

<form>
<input name="url" type="text" style=" width:800px; "><br>
<input type="image" src="image.gif" alt="送信する" onclick=window.open( 'http://www.hoge.com/' & this.form.url.value) align="middle">
</form>

No.1 ベストアンサー 回答者： DoubtOwl 回答日時： 2015/06/09 14:03

1.　onclickがダブルクォーテーションで囲まれていない

2.　文字列結合は＆ではなく＋
3.　this.form.url.valueで取れるなら変更不要ですがdocument.forms[0].url.valueとしました。

<input name="url" type="text" style=" width:800px; "><br>
<input type="image" src="image.gif" alt="送信する" onclick="window.open( 'http://www.hoge.com/' + document.forms[0].url.value)" align="middle">

この回答へのお礼

お返事遅くなり申し訳ありません。
分かりやすく説明いただき本当に有難うございました。
ご指摘頂いた通りで、無事解決致しました。
助かりました。

お礼日時：2015/06/12 19:17

No.2 回答者： Ogre7077 回答日時： 2015/06/09 14:12

少々汎用的に作るなら

<script>(function(){
addEventListener('submit', function(ev){
var form = ev.target, name = form.name;
if (name == 'anchor') {
ev.preventDefault();
var n = form.elements['q'].value;
var u = 'ttp://www.example.com/@/'.replace(/@/,n);
window.location = u;
}
}, true);
})()</script>

<form name=anchor><input type=text name=n value=123><input type=image src=image1.png></form>
<form name=anchor><input type=text name=n value=987><input type=image src=image2.png></form>

この回答へのお礼

お返事遅くなり申し訳ありません。
汎用性のある見解も参考になりました。
有難うございました。

お礼日時：2015/06/12 19:20