jQuery モバイルを使用して、現在のページの URL を基準にしてボタンの href 値を設定する必要があります。
だから私は素朴に次のコードを書いた:
var path = window.location;
path = path.replace( "shop","edit" );
$("#btnEdit").setAttr( "href", path );
ページの URL はhttp://mysite/shop/1で、ボタンの href はhttp://mysite/edit/1に設定する必要があります。
このコードが「pageinit」ハンドラーの上部に挿入されると、ブラウザー (firefox & chrome) のロケーション バーの URL がhttp://mysite/shop/shopに変更され、ページが明らかにリロードされるので、 /shop/ の後に数字が必要で、値が 1 であるため、404 エラーが発生します。
コメントアウトして Web サーバーを再起動しても、ブラウザーは自動的にhttp://mysite/shop/1をURL ロケーション フィールドのhttp://mysite/shop/shopに置き換えます。?!
これらの指示にコメントし、サーバーを再起動して、この URL の置き換えを回避する必要があります。
何が起こっている ?この厄介な副作用なしに、ページの場所の URL を取得し、ボタンの href 値を設定するにはどうすればよいですか?
編集1:
- 実際、存在しない .setAttr の代わりに.attrまたは.propを使用する必要があります。
- URL の変更は chrome と firefox でのみ表示され、iPad、Android、または IE9 では表示されません。Chromeデバッグ ツールを実行すると、matchs.call( document.documentElement, "[test!='']:sizzle" );命令で jQuery によって DOMException がスローされるようです。. それが何を意味するのか、なぜページが別の URL でリロードされるのか、私にはわかりません。
編集2:
- fapws を Web サーバーとして、mako をテンプレートとして使用しています。mako によって生成されたキャッシュされた python ファイルを消去した後、url の変更が消えました。?!
- 提案されているように、 .attrとwindow.location.hrefを使用する必要があります。これは機能し、ボタンの href 属性が正しい値に設定されました。
- それはまだうまくいきませんが。予期せぬ望ましくない動作が新たに見られるようになりました。ボタンをクリックすると、ロケーション バーの URL がhttp://mysite/edit/1に変更され、ショップ ページの pageinit が実行され (?!)、その pageinit イベントを実行せずに編集ページが読み込まれます。
解決:
html ファイルでは、このボタンをデフォルトの href 値で定義し、特別なものは何もありません:
<a href="#" data-role="button" data-icon="pencil" id="btnEdit"> Edit </a>
スクリプト ファイルでは、より正確には $(document).on('pageinit',...) のハンドラーで、href 値を設定するだけでなく、ボタンに rel="external" 属性を追加するこのコードがあります。 .
var path = window.location.href;
path = path.replace( "shop","edit" );
$("#btnEdit").attr( "href", path ).attr( "rel", "external" );
ページの自動リロードがなくなり、ロードの奇妙な動作が削除されました。これは、jQuery Mobile の <a> タグのデフォルトの動作が、通常のフル ページ ロードではなく、ajax を使用してターゲット ページをロードすることであるために発生しました。属性 rel="external" はこの動作を無効にし、参照されたページは正常に完全に読み込まれます。この動作については、こちらの jQM ドキュメントで説明されています。
注:多くの回答がこの問題を解決するのに具体的に貢献しましたが、マッドマンムーンの回答は非常に役に立ち、ポイントが少なかったので確認しました。複数の回答をチェックすることができれば、私はそれをしたでしょう。