--- title: パラメータを渡してのページ遷移 tags: HTML jQuery Get author: ekzemplaro slide: false --- ページ遷移をする時にパラメータを渡す方法と受け取る方法です。 元のページ aa01.html ![page_feb1501.png](https://qiita-image-store.s3.amazonaws.com/0/179446/0fd3966c-0848-2630-f9d5-298b2a863f3a.png) クリックして遷移したページ bb01.html ![page_feb1502.png](https://qiita-image-store.s3.amazonaws.com/0/179446/3636a8e2-0e10-dbbd-25fb-7834108ab62f.png) ページのソース ```html:aa01.html aa01
outarea_aa
outarea_bb
outarea_cc
outarea_dd
outarea_ee
outarea_ff
outarea_gg
outarea_hh

Feb/15/2018

``` ```js:button_click_monitor.js // ------------------------------------------------------------------- // button_click_monitor.js // // Feb/15/2018 // // ------------------------------------------------------------------- jQuery(function() { jQuery('#outarea_aa').text("*** button_click_monitor.js *** start ***") button_click_monitor () jQuery('#outarea_hh').text("*** button_click_monitor.js *** end ***") }) // ------------------------------------------------------------------- // [8]: function button_click_monitor () { jQuery ("button").click (function () { window.location.href = "bb01.html" + "?id=" + this.id }) } // ------------------------------------------------------------------- ``` 遷移先のページ ```html:bb01.html bb01


outarea_aa
outarea_bb
outarea_cc
outarea_dd
outarea_ee
outarea_ff
outarea_gg
outarea_hh

Feb/15/2018

``` ```js:bb01.js // ------------------------------------------------------------------- // bb01.js // // Feb/15/2018 // // ------------------------------------------------------------------- function getParam() { var url = location.href parameters = url.split("?") params = parameters[1].split("&") var paramsArray = [] for ( it = 0; it < params.length; it++ ) { neet = params[it].split("=") paramsArray.push(neet[0]) paramsArray[neet[0]] = neet[1] } var categoryKey = paramsArray["id"] return categoryKey } // ------------------------------------------------------------------- jQuery(function() { jQuery('#outarea_aa').text("*** bb01.js *** start ***") const idx = getParam() var str_tmp = "" str_tmp += "Getパラメータ「id」の値は、"+ idx +" です。
" jQuery('#outarea_bb').html(str_tmp) const value = idx jQuery("#category").val(value) jQuery('#outarea_hh').text("*** bb01.js *** end ***") }) // ------------------------------------------------------------------- ```