2012-06-22 22 views
5

Tôi đang phát triển một ứng dụng kim tự tháp đơn giản, nơi tôi đang sử dụng JQuery để thực hiện các yêu cầu AJAX. Tôi có cho đến bây giờ đã có mã javascript của tôi trong mẫu chameleon của tôi. Bây giờ tôi muốn trích xuất javascript của tôi vào một vị trí khác (ví dụ như tài nguyên tĩnh).Mẫu Chameleon cho tệp javascript?

Vấn đề của tôi là tôi tìm mã javascript của tôi dựa trên nội dung tự động tạo ra như vậy:

$.post("${request.route_url('my_view')}",{'data': 'some data'}, function(html){ 
    $("#destination").html(html); 
}); 

Yếu tố năng động phúc:

"${request.route_url('my_view')}" 

Đó là cách gọi phương thức route_url của đối tượng yêu cầu trong khuôn mẫu.

Có mẫu được công nhận để tách các tệp javascript đó thành các mẫu của riêng chúng và cung cấp tuyến đường và chế độ xem cho chúng hay tôi chỉ cần giữ javascript trong mẫu trang của mình?

Trả lời

9

Có; bạn thường đặt thông tin theo ngữ cảnh cụ thể như các tuyến được mở rộng vào các mẫu và truy cập thông tin này từ các thư viện JavaScript (tĩnh) của bạn.

Bao gồm các thông tin bối cảnh có thể được thực hiện theo những cách khác nhau, tùy theo khẩu vị:

  1. Bạn có thể sử dụng một thuộc tính dữ liệu vào một thẻ trong HTML được tạo của bạn:

    <body data-viewurl="http://www.example.com/route/to/view"> 
        ... 
    </body> 
    

    đó bạn , trong tải mã JS tĩnh của bạn với jQuery .data() function:

    var viewurl = $('body').data('viewurl'); 
    
  2. Dùng làm-up LINK tag mối quan hệ để đưa liên kết vào đầu tài liệu:

    <head> 
        <link rel="ajax-datasource" id="viewurl" 
          href="http://www.example.com/route/to/view" /> 
        ... 
    </head> 
    

    mà có thể được lấy ra sử dụng $('link#viewurl').attr('href'), hoặc $('link[rel=ajax-datasource]').attr('href'). Điều này chỉ thực sự hoạt động đối với thông tin URL.

  3. Tạo biến JS thẳng trong mẫu của bạn, để được tham chiếu từ mã tĩnh của bạn:

    <head> 
        ... 
        <script type="text/javascript"> 
         window.contextVariables = { 
          viewurl = "http://www.example.com/route/to/view", 
          ... 
         }; 
        </script> 
    </head> 
    

    và các biến này là referable trực tiếp với contextVariables.viewurl.

+0

Câu trả lời hay, cảm ơn. –

+0

Tôi đã chọn tùy chọn 2 vì nó có vẻ phù hợp với những gì tôi đang làm tốt nhất. –

Các vấn đề liên quan