0

私は基本的に、ユーザー入力を使用して URL フレンドリーなクエリ文字列を作成しようとしています。変数はスペースと @ を置き換えてすべて一緒に追加すると、関数は段落に URL を表示する必要があります。これは、私が台無しにしているのは本当に単純なことだとわかっているので、私は本当にばかげていると感じています。私の間違いを指摘してください。補足として、すべての変数を使わずにこのすべての置換を行うより良い方法はありますか?

次のコードは次のような文字列を返します: https://www.somewebsite.com/formhandler.php?&fname=gordie&address=123+main+street&email=something%40somewhere.com

<SCRIPT TYPE="TEXT/JAVASCRIPT">

var fnstr = document.getElementById("firstname").value; 
var fncutspace = fnstr.trim();
var fnrepspace = fncutspace.replace(/ /g,"+");
var fnfinal = fnrepspace.replace("@","%40");
var adstr = document.getElementById("address").value; 
var adcutspace = adstr.trim();
var adrepspace = adcutspace.replace(/ /g,"+");
var adfinal = adrepspace.replace("@","%40");
var emstr = emdocument.getElementById("firstname").value; 
var emcutspace = emstr.trim();
var emrepspace = emcutspace.replace(/ /g,"+");
var emfinal = emrepspace.replace("@","%40");
var domurl = "https://www.somewebsite.com/formhandler.php?&fname=";
var secondchunk = "&address=";
var thirdchunk = "&email=";
var url = domurl + fnfinal + secondchunk + adfinal + thirdchunk + emfinal;

function createurl() {
document.getElementById("demo").innerHTML = url;
}
</SCRIPT>

<FORM action="javascript:createurl()">
Fisrt Name:<INPUT id="firstname" TYPE="TEXT"><br>
street address:<INPUT id="address" TYPE="TEXT"><br>
email address:<INPUT id="email" TYPE="TEXT"><br>
<input type="submit" value="GO">
</FORM>

<p id="demo"></p>
4

4 に答える 4

1

ユーザー入力に基づいていると思われる場合は、変数を移動して宣言し、内部で設定する必要がありますcreateurl

function createurl() {
    var fnstr = document.getElementById("firstname").value; 
    var fncutspace = fnstr.trim();
    var fnrepspace = fncutspace.replace(/ /g,"+");
    var fnfinal = fnrepspace.replace("@","%40");
    // etc.
    var url = domurl + fnfinal + secondchunk + adfinal + thirdchunk + emfinal;

    document.getElementById("demo").innerHTML = url;
}

そうすれば、関数が呼び出された時点で現在の入力値に設定されます。

補足として、すべての変数を使わずにこのすべての置換を行うより良い方法はありますか?

メソッド呼び出しを連鎖させることができます:

var fnInput = document.getElementById('firstname');
var fnfinal = fnInput.value.trim().replace(/ /g,"+").replace("@","%40");
于 2012-06-23T06:23:06.357 に答える
1
<FORM action="javascript:createurl()">
Fisrt Name:<INPUT id="firstname" TYPE="TEXT"><br>
street address:<INPUT id="address" TYPE="TEXT"><br>
email address:<INPUT id="email" TYPE="TEXT"><br>
<input type="submit" value="GO">
</FORM>

<p id="demo"></p>

<SCRIPT TYPE="TEXT/JAVASCRIPT">

var fnstr = document.getElementById("firstname").value; 
var fncutspace = fnstr.trim();
var fnrepspace = fncutspace.replace(/ /g,"+");
var fnfinal = fnrepspace.replace("@","%40");
var adstr = document.getElementById("address").value; 
var adcutspace = adstr.trim();
var adrepspace = adcutspace.replace(/ /g,"+");
var adfinal = adrepspace.replace("@","%40");
var emstr = emdocument.getElementById("firstname").value; 
var emcutspace = emstr.trim();
var emrepspace = emcutspace.replace(/ /g,"+");
var emfinal = emrepspace.replace("@","%40");
var domurl = "https://www.somewebsite.com/formhandler.php?&fname=";
var secondchunk = "&address=";
var thirdchunk = "&email=";
var url = domurl + fnfinal + secondchunk + adfinal + thirdchunk + emfinal;

function createurl() {
document.getElementById("demo").innerHTML = url;
}
</SCRIPT>

おそらく、コールバック関数で DOM に依存するすべての JavaScript 関数を実行する必要がありwindow.onloadます。

window.onload = function ()
{
Javascript code goes here
}
于 2012-06-23T06:07:58.803 に答える
-1

組み込みの JavaScript 関数encodeURIencodeURIComponent、または必要escapeに応じて使用することもできます: http://www.w3schools.com/jsref/jsref_encodeuri.asp

于 2012-06-23T06:00:52.360 に答える
-1

encodeURIComponent(string)現在行っているトリミング/交換の代わりに使用する必要があります。

于 2012-06-23T06:01:14.743 に答える