下記のように、1optionにつき複数valueを指定することができないため、正しい記述方法がありましたら教えてください。よろしくお願いします。
<select id="selectstyle" onchange="changesytle(value);">
<option value="css/style1.css" value="js/style1.js">スタイル1</option>
<option value="css/style1.css" value="js/style2.js">スタイル2</option>
</select>
url に含まれにくい文字で、css と javascript の url をつなげたものを value に指定して、String#split で、分割すれば良いと思います。
例えば、セミコロンで区切るとしたら。
<select id="selectstyle" onchange="changesytle(value);"> <option value="css/style1.css;js/style1.js">スタイル1</option> <option value="css/style1.css;js/style2.js">スタイル2</option> </select>
<script> // 関数 changeStyle は、使ってる select よりも前にあっても大丈夫 function changeStyle(sel) { var opt = sel.options[sel.selectedIndex]; var val = opt.value.split(";"); // セミコロンで option の value を分割する alert(val[0]); // ひとつめが、css の URL alert(val[1]); // ふたつめが、javascript の URL } </script> <select id="selectstyle" onchange="changeStyle(this);"> <!-- this で select を関数に渡す --> <option value="css/style1.css;js/style1.js">スタイル1</option> <option value="css/style2.css;js/style2.js">スタイル2</option> </select>
String#split は、その文字列を、引数に指定した文字で分割して、その分割された複数の文字列からなる 配列 を返します。
id:m0r1y055tan さんがコメントに書いたコードだと、こんな感じになります。
function myFunction() { var str = "css/style1.css;js/style1.js"; var res = str.split(";"); // 文字列 str をセミコロンで分割 document.getElementById("selectstyle").href = res[0]; // 分割されたひとつ目が、スタイルシートの URL }
記述場所はselect optionのすぐ下でよいのでしょうか?
javascript の関数名は、最後に解釈されるので、<script> での定義が、実際に使われている <select> よりも前にあっても問題ありません。
url に含まれにくい文字で、css と javascript の url をつなげたものを value に指定して、String#split で、分割すれば良いと思います。
例えば、セミコロンで区切るとしたら。
<select id="selectstyle" onchange="changesytle(value);"> <option value="css/style1.css;js/style1.js">スタイル1</option> <option value="css/style1.css;js/style2.js">スタイル2</option> </select>
<script> // 関数 changeStyle は、使ってる select よりも前にあっても大丈夫 function changeStyle(sel) { var opt = sel.options[sel.selectedIndex]; var val = opt.value.split(";"); // セミコロンで option の value を分割する alert(val[0]); // ひとつめが、css の URL alert(val[1]); // ふたつめが、javascript の URL } </script> <select id="selectstyle" onchange="changeStyle(this);"> <!-- this で select を関数に渡す --> <option value="css/style1.css;js/style1.js">スタイル1</option> <option value="css/style2.css;js/style2.js">スタイル2</option> </select>
String#split は、その文字列を、引数に指定した文字で分割して、その分割された複数の文字列からなる 配列 を返します。
id:m0r1y055tan さんがコメントに書いたコードだと、こんな感じになります。
function myFunction() { var str = "css/style1.css;js/style1.js"; var res = str.split(";"); // 文字列 str をセミコロンで分割 document.getElementById("selectstyle").href = res[0]; // 分割されたひとつ目が、スタイルシートの URL }
記述場所はselect optionのすぐ下でよいのでしょうか?
javascript の関数名は、最後に解釈されるので、<script> での定義が、実際に使われている <select> よりも前にあっても問題ありません。
※varにあるselectstyleの後にある2は不要です。
あ、コメント、入れ違い (^^ゞ
a-kuma3さん
いろいろ有り難うございました♪ ^ - ^
なんとなくJavascriptはとっつきにくかったのですが、a-kuma3さんから頂いた構文を解読していくうちに、いつか自分でも応用して記述できるようになれるかも?と希望を持てそうです。
何かが悪さして今回はうまくいかなかったですが、ベストアンサーとさせていただきます。有り難うございました!"<(^ _ ^)>"
cssfilename = new Array('hoge1.css','hoge2.css');
valueは0,1,…でいいと思います。cssfilename[value]で参照。jsも同様に。
pogpiさん
いつも有り難うございます。私は初心者なので、pogpiさんの回答は少し難しいです。でも有り難うございました。<(_"_)>
あ、コメント、入れ違い (^^ゞ
2014/08/24 00:21:39a-kuma3さん
2014/08/24 19:23:17いろいろ有り難うございました♪ ^ - ^
なんとなくJavascriptはとっつきにくかったのですが、a-kuma3さんから頂いた構文を解読していくうちに、いつか自分でも応用して記述できるようになれるかも?と希望を持てそうです。
何かが悪さして今回はうまくいかなかったですが、ベストアンサーとさせていただきます。有り難うございました!"<(^ _ ^)>"