0

_SiteLayout.cshtml によって参照される Site.css ファイルを修正して、テーブルの内容に境界線を付けようとしました。

table {
    border-collapse: collapse;
    border-spacing: 0;
    margin-top: 0.75em;

    /* added below 4/23/2013 and commented out: border: 0 none; */
    border-color: #600;
    border-width: 0 0 1px 1px;
    border-style: solid;
}

. . .

td {
    padding: 0.25em 2em 0.25em 0em;

    /* added below 4/23/2013 and commented out: border: 0 none;*/
    border-color: #600;
    border-width: 1px 1px 0 0;
    border-style: solid;
    margin: 0;
    padding: 4px;
    background-color: #FFC;
}

私のテーブルには境界線が表示されませんが、なぜでしょうか?

アップデート

さて、テーブルに境界線を追加しようとした後、突然 jQuery が機能しなくなりました。だからここにスクープがあります：

_SiteLayout.cshtml は .css ファイルを参照します。

<link href="~/Content/Site.css" rel="stylesheet" type="text/css" />

そのファイルには、次のものがあります。

table {
    border-collapse: collapse;
    border-spacing: 0;
    margin-top: 0.75em;

    /* added below 4/23/2013 and commented out: border: 0 none; 
    border-color: #600;
    border-width: 0 0 2px 2px;
    border-style: solid;*/
    border: 1px solid #600;
}

td {
    padding: 0.25em 2em 0.25em 0em;

    border:1px solid #600;
    margin: 0;
    padding: 4px;
    background-color: #FFC;
}

(テーブルと td の間に他のタグがあることを示す省略記号は、混乱を避けるために省略されています)

私の Default.cshtml 全体は次のとおりです。

@{
    Layout = "~/_PlatypusLayout.cshtml";
    Page.Title = "Home Page";
}
        <input type="submit" id="submit" value="Get SSCSSETUP.XML" />
        <div id="Platypus_Setup">
        </div>
        <input type="submit" id="submit2" value="Get PlatypusSETUP_000002.XML" />
        <div id="Platypus_Setup2">
        </div>
        <input type="submit" id="submit3" value="Get PlatypusSETUP_000003.XML" />
        <div id="Platypus_Setup3">
        </div>
<script>
    $(document).ready(function () {
        $('#submit').click(function () {
            $.ajax({
                type: "GET",
                url: "DuckbillSETUP.XML",
                dataType: "xml",
                success: function (PlatypusSetupRec) {
                    var Platypussetup = "<table><thead><th>Platypus Number</th><th>Platypus Name</th></thead>";
                    $(PlatypusSetupRec).find('Platypus').each(function () {
                        var PlatypusNum = $(this).find('PlatypusNumber').text();
                        var PlatypusName = $(this).find('PlatypusName').text();
                        Platypussetup += "<tr>";
                        Platypussetup += "<td>" + PlatypusNum + "</td>";
                        Platypussetup += "<td>" + PlatypusName + "</td>";
                        Platypussetup += "</tr>";
                    });
                    Platypussetup += "</table>";
                    $('#Platypus_Setup').append(Platypussetup);
                },
                error: function (xhr) {
                    alert(xhr.status);
                }
            });
            return false;
        });
    });
</script>

最初のボタンをクリックするとテーブルが表示されましたが、Site.css を変更したり、Chrome で Ctrl+R を押したりしたために、クリック ハンドラーが聞こえなくなったり、フックが外れたり、何らかの形で誤動作したりしました...

4

5 に答える 5

3

テーブルと td スタイル定義の間の 3 つのドットがコードにも表示される場合、それらが原因である可能性があります。

于 2013-04-23T17:56:07.097 に答える
1

「ReferenceError: $ が定義されていません [このエラーでブレーク]...

これは、スクリプトが何が何であるかを認識していないことを示しています$。考えられる問題は 2 つあります。

  1. jQuery をインポートしていない (可能性は低い)
  2. 実際のスクリプトの後にjQuery.jsをインポートしました。

ファイルのインポート順序を確認します。最初に jQuery、次にスクリプトです。

于 2013-04-23T19:16:08.950 に答える