0

世界。私はまだ Python と JavaScript の初心者なので、私のコードと私のメソッドは、経験豊富な開発者にとっては少し「奇妙」に見えるかもしれませんが、今日、1 つまたは 2 つのことを学べることを期待しましょう。

django によってコードが生成された HTML ページがあります。

HTMLテーブルコードを生成するDjango関数:

def calendar_days_define(cMonth, cYear):
    Calendar = []
    calendarMatrix = calendar.monthcalendar(cYear, cMonth)
        for element in calendarMatrix:
            Calendar.append('<tr>')
            weekday = 0
            for i in element:
                weekday += 1 
                    if weekday > 5:
                        if i > 0:
                            Calendar.append('<td class="days_Weekends_days">{0}</td>'.format(i))
                        else:
                            Calendar.append('<td class="days_Weekends_days"></td>')
                    else:
                        if i > 0:
                            Calendar.append('<td class="days_Works_days">{0}</td>'.format(i))
                        else:
                            Calendar.append('<td class="days_Works_days"></td>')
            Calendar.append('</tr>')
        DoneCalendar = ''.join(Calendar)
        DoneCalendar = '<table id="calendar_Inside_Changeable_Mesh">{0}</table>'.format(DoneCalendar)
        return DoneCalendar

それはまさに私が必要とする方法で、HTML テーブルにラップされた素敵なカレンダーを生成します。別の月に新しいテーブルを生成したいときに問題が発生します。新しいカレンダー テーブルを生成する必要があるため、JavaScript による ajax 呼び出しを使用して、django に新しい HTML テーブル コードを生成させ、古いテーブルを新しいテーブルに置き換えます。

function redrawCalendar(cMonth, cYear) {
 $.ajax({
  type: 'POST',
  url: '/edit/ajax_change_calendar',
  data: {cMonth: cMonth, cYear: cYear},
  success: function (data) {
   $('#calendar_Inside_Changeable_Mesh').replaceWith(data);
  }
 })
}

これにより、新しいテーブルが作成されますが、問題は、この新しいテーブルにアクセスできないことです。例えば:

$('.days_Work_days').css("color","red") 

動作しなくなりました。なんで?クライアントサイドでJavaScriptでテーブルのコードを生成するのがより適切な方法のような気もしますが、その場合は書き直しますが、やはり気になります。誰かがここで私を助けることができれば、感謝します。

アップデート

変更が発生する最初の HTML ページの一部を次に示します。

<table><tr><td> {{ defineCalendar|safe }} </td></tr></table>

ページが読み込まれると、django はこの変数に id="calendar_Inside_Changeable_Mesh" を含むカレンダー テーブルを設定し、ソース ページは次のようになります。

<table><tr><td> 
 <table id="calendar_Inside_Changeable_Mesh"> ...a bunch of <tr> and <td> with days numbers as value... </table>
</td></tr></table>

JS でこのテーブルに $('#calendar_Inside_Changeable_Mesh') としてアクセスできます。例えば:

$('#calendar_Inside_Changeable_Mesh').css('border-collapse','collapse')

すべて順調。ページ全体をリロードせずに新しいカレンダー テーブルを生成する場合は、前に示した ajax JS 関数を呼び出します。その後、HTML 部分は次のようになります。

<table><tr><td> 
 <table id="calendar_Inside_Changeable_Mesh"> ...a bunch of <tr> and <td> with different days numbers as value... </table>
</td></tr></table>

ほとんど同じように見えますが、たとえばもう一度行うと、次のようになります。

$('#calendar_Inside_Changeable_Mesh').css('border-collapse','collapse')

何も起こりません。

ボタンをクリックするとJSが発生します。

$('#calendarBtn_Back').click(function() {
    redrawCalendar(cMonth, cYear)
)}

ボタンは calendar_Inside_Changeable_Mesh テーブルの外側にありますが、それを含むテーブルの内側にあります。

最終更新

わかりました、それは私の側ではかなりばかげていました。神酒のために2日かかりました。私の間違いは、私が何をしているかを正確に皆さんに見せなかったことです。使ってるって言ってた

$('#calendar_Inside_Changeable_Mesh').css('border-collapse','collapse')

実際には次のように見えたとき:

var calendar_Inside_Changeable_Mesh = $('#calendar_Inside_Changeable_Mesh');

そして、このグローバル変数は次の関数で使用されました。

calendar_Inside_Changeable_Mesh.css('border-collapse','collapse');

ページが読み込まれると、すべて正常に動作します。しかし、同じIDでもテーブルを新しいテーブルに動的に置き換えると、変数とのバインドが明らかに壊れます。関数内で変数宣言を移動すると、関数が問題を解決するたびに変数が要素にバインドされます。さて、皆さん回答ありがとうございます。あなたのアドバイスのおかげで、正しい方向に考えることができました。次回は、正確で正確なスニペットを投稿するようにします。

4

2 に答える 2

0

この行が機能しない理由は、クラス名のスペルが間違っているためです。

$('.days_Work_days').css("color","red")

探しているpythonコード内days_Works_day

if i > 0:
    Calendar.append('<td class="days_Works_days">{0}</td>'.format(i))
else:
    Calendar.append('<td class="days_Works_days"></td>')

js を次のように変更します。

$('.days_Works_days').css("color","red")
于 2013-09-25T09:31:15.707 に答える
0

私が考えることができるいくつかの可能性は、それらを1つずつ排除する必要があります:

  • 不正な HTML
  • HTMLを置き換えた後、CSSを処理するスクリプトが呼び出されませんでした
  • CSS セレクタが間違っているか、ターゲット DOM 要素の xpath が変更されました

さらにヘルプが必要な場合は、デバッグ コンソールを使用して詳細情報を貼り付けてください。

于 2013-09-25T08:34:51.693 に答える