Safariで<a href...が正しく動作しません

前提・実現したいこと

Windowsサーバー上で動作するPHPのスクリプトで、
MySQLで検索した得意先名にカナの読みを表示し、カナ文字を指定した時に、テーブル上のカナ読みの位置に位置合わせを
する操作があります。
これをiPad上のブラウザSafariでも使用したいと思います。

発生している問題点

iPad上のブラウザで、htmlのタグがうまく動作しません。
位置合わせは、
<a href="#ア">
aタグを使って、飛ばしているだけの単純なものです。

おそらく、カナ文字が正しく判別されないことが原因だと思うのですが、何か対処策は無いでしょうか？
ただ、画面上のカナ文字表示が化けているようなことはありません。
随分と前に試行錯誤で作ったページなので、charsetもshift-JISになっていますが、これも問題ではないかと思います。
データベースもShift-JISになっており、他システムとも連携しているので、今更替えることも大変な作業なので、
なんとかこのまま乗り切れることが出来ればよいなと思っています。

該当のソースコード

PHP
1<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
2<html>
3<head>
4</head>
5<meta http-equiv='Content-Type' content='text/html; charset=Shift_JIS'>
6<body>
7<?php
8// パラメタ等は省略してあります
9$sqlk="SELECT b.ctrtrcd, b.ctrtrsc, b.ctrtrnm, b.ctrtrnk, c.chgtrnm FROM ctkmst AS a LEFT JOIN ctrmst AS b ON (a.ctktkcd=b.ctrtrcd AND a.ctktksc=b.ctrtrsc) ";
10$sqlk.="LEFT JOIN chgctr AS c ON (b.ctrtrcd=c.chgtrcd) ";
11$sqlk.="WHERE a.ctksycd = {$ck_sycd} AND b.ctrtrcd <> 99999 order by trim(b.ctrtrnk)";
12include("hat_dbopen.php");
13?>
14<div id="drop">
15	<ul class="clearfix">
16		<li><a href="#">ア</a>
17			<ul>
18				<li><a href="#ア">ア</a></li>
19				<li><a href="#イ">イ</a></li>
20				<li><a href="#ウ">ウ</a></li>
21				<li><a href="#エ">エ</a></li>
22				<li><a href="#オ">オ</a></li>
23			</ul>
24		</li>
25		<li><a href="#">カ</a>
26			<ul>
27				<li><a href="#カ">カ</a></li>
28				<li><a href="#キ">キ</a></li>
29				<li><a href="#ク">ク</a></li>
30				<li><a href="#ケ">ケ</a></li>
31				<li><a href="#コ">コ</a></li>
32			</ul>
33		</li>
34	</ul>
35</div>
36<br><br><br>
37<table width="370px" style="border-collapse: collapse;text-align:left;">
38<tr>
39<td class=h>コード</td>
40<td class=h></td>
41<td class=h>得意先名</td>
42</tr>
43<?php
44if ($tkkb == 'false') {
45	if ($unmng == 'true') { $sqlk = $sqls; }
46	$rs = mysqli_query($cn, $sqlk) or die("クエリ失敗 :".mysqli_error($cn));
47	$kanaw = "";
48	while ($row = mysqli_fetch_assoc($rs)) {
49		print "<tr>";
50		$kana = mb_convert_kana(substr($row['ctrtrnk'],0,1),"K");
51		if ($kanaw == $kana){
52			print "<td>";
53		} else {
54                        // 頭出し用のカナ文字
55			print "<td id='{$kana}'>";
56		}
57		print "{$row['ctrtrcd']}-{$row['ctrtrsc']}</td>";
58		$trnm = str_replace("　", "", $row['ctrtrnm']);
59		$trnm = str_replace(" ", "", $trnm);
60		if ($row['chgtrnm'] != '') {
61			$trnm = str_replace("　", "", $row['chgtrnm']);
62			$trnm = str_replace(" ", "", $trnm);
63		}
64		print "<td>".$kana."</td>";
65		print "</tr>\n";
66	}
67} else {
68	$rs = mysqli_query($cn, $sqlt) or die("クエリ失敗 :".mysqli_error($cn));
69	while ($row = mysqli_fetch_assoc($rs)) {
70		print "<tr>";
71		print "<td></td>";
72		print "<td></td>";
73		print "</tr>\n";
74	}
75}
76?>
77</table>
78</body>
79</html>

補足情報（FW/ツールのバージョンなど）

#####サーバー側

WindowsServer 2012 + IIS
MySQL 5.5
php5.4

######クライアント側

IOS 13.1
Safari

m.ts10806

2020/02/28 11:58

HTMLもPHPも色々古すぎて使えない技術になってしまいそうですけど、絶対にこの環境でないといけないのでしょうか。

hatsuzo

2020/03/02 00:20

コメントありがとうございます。当面はこの環境で動かすことになると思います。ただ、社内で誰もメンテできる人間がいないので何れは別の方法をとることになりますが、それ以外だとどんな方法なのでしょうか？パッケージを入れる位しか思い浮かびませんが、時代についていけてないのでしょうね。(;^ω^)

m.ts10806

2020/03/02 00:30

「パッケージ」が何を想定されているのかわかりませんが、サポート終了したバージョンを使うのはデメリットしかないので、作りはともかく最新で動くように改修します。

hatsuzo

2020/03/02 08:23

>HTMLもPHPも色々古すぎて使えない技術になってしまいそうですけど、 >絶対にこの環境でないといけないのでしょうか。これは、バージョンのことを言われているのですね。失礼しました。確かにいつかバージョンを上げる必要はありますね。その余裕がないので、「パッケージ」ソフト、もしくはクラウドサービスに切り替えるしかないのかな、という意味です。

行動規範の内容に同意します

回答1件

idに利用してハッシュでとばしたいならせめてurlencodeしてください

PHP
1<?php
2$u["ア"]=urlencode("ア");
3print <<<eof
4<a href="#{$u["ア"]}">ア</a>
5<div id="{$u["ア"]}">ア</div
6eof;

投稿2020/02/28 09:57

yambejp

総合スコア114843

yambejp

2020/02/28 10:02

idには本来%は含んではいけないのでこれもオススメではないんですけどね

hatsuzo

2020/03/02 00:51

アドバイス有難うございます。申し訳ないですが、ヒアドキュメントはあまり使ったことが無いので、 print <<<eof <a href="#{$u["ア"]}">ア</a> <div id="{$u["ア"]}">ア</div eof; の意味がよく判りません。タグでくくっている、"ア"　の部分を　"#{$u["ア"]}" と置き換えるという意味で解釈すればよいのでしょうか？

yambejp

2020/03/02 00:54

ヒアドキュメントがいやなら普通にやってください $u["ア"]=urlencode("ア"); print "<a href=\"#{$u["ア"]}\">ア</a>\n"; print "<div id=\"{$u["ア"]}\">ア</div>\n";

hatsuzo

2020/03/02 08:41

有難うございました。ご指摘の通り置き換えてみたのですが、うまく動作しませんでした。結局、hrefの中にカナ文字を入れない方法で逃げました。 JavaScript内のパラメタではカナ文字が入っていても化けないようです。根本的な解決ではないですが(;^ω^)、テーブル上からリンクで頭出しするのではなく、jQueryでテーブルから一致する行を抽出する方法に変えました。 <script type="text/javascript"> $(function(){ $('#button').bind("click",function(){ var re = new RegExp($('#search').val()); $('#result tbody tr').each(function(){ var txt = $(this).find("td:eq(1)").html(); if(txt.match(re) != null){ $(this).show(); }else{ $(this).hide(); } }); }); }); function OnLinkClick(s) { document.f1.search.value = s; } </script> （略） <a href="javascript:OnLinkClick('ア');">ア</a> <a href="javascript:OnLinkClick('イ');">イ</a> どうも有難うございました。

行動規範の内容に同意します