js 함수 로드

17706 단어 jquery-pjax

묘사

저는 pjax를 사용합니다. 모든 것이 정상이지만 단 한 가지입니다.
내용과 js를 로드할 때 js on load가 작동하지만 기능은 다음과 같습니다.
var map = {
    init : function() {
        alert('test');
    }

}

map.init
이 함수는 호출되지 않았고 일반 함수function test() { ... }도 작용하지 않았다. 왜?

토론 #1

헤이,
나는 이것이 맞춤법 오류인지 모르겠지만, init는 맵이라고 불러야 한다.init();정확했어그리고 "}"뒤에 점수 번호를 추가합니다.
JSFIDLE에서 작동합니다.http://jsfiddle.net/2cSxW/
var map = {
    init: function() {
        alert('test');
    }

};

map.init();​
감사합니다!네, 고맙습니다.

토론 #2

Np!

토론 #셋

이런 새로운 문제에 부딪혔다.
나는 #main containter div를 사용하는데 그 중 모든div와 스크립트에 javascrpt 코드가 있고 pjax를 사용하여 다음과 같은 기능을 수행한다.
$('a[data-pjax]').pjax({
    container: '#main_container',
    fragment: '#main_container'
});
현재 링크를 눌렀을 때 #main container div가 새 것으로 바뀌었지만, 페이지를 검사할 때,div만 보였습니다.

토론 #4

표시가 전혀 없습니다. 그래서javascript는 불러오지 않았습니다. 왜fragment를 사용할 때 이런 상황이 발생했습니까? 이 경우는 없습니다. 페이지에main container div만 남았습니다. 클릭할 때 불러와야 합니까?<script> 상응하는

토론 #5

표시를 발표할 수 있습니까?또는, 만약 당신이 그것을 JSFiddle에 넣을 수 있다면 더욱 좋을 것입니다. 이렇게 하면 전체 화면을 더욱 쉽게 볼 수 있습니다.네가 말한 바와 같이 HTML 라벨은 전혀 보이지 않는다. 나는 전체 그림을 보면 도움이 될 것이라고 추측한다!
감사합니다!
사갈<script> 여기는 링크:

토론 #6

메인 내용에 두 개의 링크가 있는지 확인하고http://fbstatusi.com/desavanja/kalendar/mesecna_lista 클릭하여 어떤 Heppens 페이지가 불러왔는지 확인하지만 스크립트가 불러오지 않았습니다. 원본 코드를 검사하고 확인하십시오.고맙습니다.내가 알아봤는데, 네가 맞았어. 내가 그것을 눌렀을 때 스크립트가 불러오지 않을 거야.하지만 페이지를 다시 불러오면 작업을 할 수 있습니다. 검사해 보셨습니까?확실하지는 않지만, 문제는 Zurka 123 스크립트 표시가 있을 수 있습니다. pjax 요청을 실행할 때 이 표시를 업데이트할 것입니다.리셋

토론 #7

일 수 있습니다.다음 사항이 유효할 수 있다고 생각합니다.
- 사용자 정의 JS 스크립트를 위한 별도의 JS 파일 만들기(현재 스크립트 태그에 인라인 연결)
- 스크립트 태그를 #main_content 태그 중 또는 div 태그 바로 아래에 놓습니다.
다시 불러올 때 작업 (가져오기 headbody 을 하고 있습니다. 이것은 스크립트 탭을 정확하게 배치하면 문제를 해결할 수 있다고 생각합니다.
또한 이 링크를 확인하십시오.http://stackoverflow.com/questions/436411/where-is-the-best-place-to-put-script-tags-in-html-markupalertmapscript 탭을 놓는 것에 대한 정보를 알고 있습니다. 하지만 저는 이렇게 해야 합니다. 만약에 제 모든 스크립트가 한 파일에 있다면 그것은 큰 파일이 될 것입니다. 왜냐하면 저는 모든 페이지에 스크립트를 사용하기 때문입니다.
네, 작업을 다시 불러올 때, pjax가 작업을 하지 않기를 요청할 뿐입니다.
제가 이 문제를 해결할 수 있습니까?
대답 고마워요.htmlNp!
모든 스크립트가 아니라, 당신이 만든 스크립트입니다. (당신이 가지고 있는 pjax 코드)스크립트 태그를

토론 #8

외부에 두시겠습니까?다른 파일에서 스크립트를 사용하지 않으려고 해도 가능할 것입니다.
또한 모듈화를 유지하려면 페이지마다 JS 파일을 설정할 수 있습니다. (작성한 JS에만 한정됩니다.)이렇게 하면 사용자 정의 스크립트를 저장할 큰 파일이 없을 것입니다.
나는 여전히

토론 #9

#main_container div 표시가 있기 때문에 script 응답에 작용하지 않지만 다시 불러올 때 작용한다고 생각한다.그것들을 #main_container! 라벨 이외에 두면 유용할 수 있다.예를 들면 다음과 같습니다.
<div id="main_content" class="shadow">
    <ul class="mesecna_lista_ul">
                <li class="datum_linija"><span class="datum_linija_text">11.09. - Utorak</span></li>
                <li class="desavanje_linija"><span class="vreme_linija">01:20h</span> - <a href="http://fbstatusi.com/desavanja/kalendar/desavanje/zurka-123" data-pjax="yes">Zurka 123</a></li>
                <li class="desavanje_linija"><span class="vreme_linija">07:10h</span> - <a href="http://fbstatusi.com/desavanja/kalendar/desavanje/sss" data-pjax="yes">sss</a></li>
    </ul>
</div>
<footer id="page_footer">
        <a href="#" class="big_button">Pošđćčtovanje</a>
        <a href="#" class="button">Pošđćčtovanje</a>
        <a href="#" class="button">asdasdsa</a>
        <a href="#" class="button">asdasdsa</a>
        <a href="#" class="button">asdasdsa</a>
        <a href="#">asdasdsa</a>
</footer>
</div> <!-- For #wrapper -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0.beta6/handlebars.min.js"></script>
<script src="/desavanja/public/js/jquery.placeholder.min.js"></script>
<script src="/desavanja/public/js/jquery.pjax.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script><script src="http://maps.gstatic.com/intl/en_us/mapfiles/api-3/9/13b/main.js" type="text/javascript"></script>
<script>

    $(document).ready(function() {

        $('a[data-pjax]').pjax({
            container: '#main_content',
            fragment:  '#main_content'
        });

    });

</script>
</body>
이 가능하다, ~할 수 있다,...
고맙습니다.pjax 그러나 새 페이지를 불러올 때 자바스크립트 코드가 있습니다. 저는 그것을 #main 용기에 넣었습니다. 왜냐하면 pjax는 이div를 세션으로 사용하고 모든 내용을 가져옵니다. 왜냐하면div#main 내용에서 스크립트를 사용하기 때문입니다.
페이지마다 자바스크립트 코드가 있습니다. 이것이 바로 제가 헤드 표시가 아닌 바디에서 사용하는 이유입니다.div 당신은 이 문제를 해결할 수 있습니까?
알겠습니다.

토론 #10

라벨 앞에 놓으면

토론 #11

라벨 밖에는 괜찮을 것입니다.</body> 네, 이런 식으로 작업을 할 수 있지만 다음 페이지에 스크립트 탭을 불러올 수 없습니다. 모든 스크립트를 한 파일에 넣거나 모든 js 코드를 넣기 전에.#main_container오, 네.알겠습니다.내가 한번 해 보고 너와 함께 돌아갈게!
고맙습니다.
Sagardiv헤이@mirzadelic, 나는wierd이지만, 나는 나의 로컬 서버에서 당신의 색인 페이지를 시도했습니다. 이것은 정상적으로 작동하는 것 같습니다!확실하지는 않아요.

토론 #12

fragment를 사용하십니까?fragment를 사용하면 localhost에서 작동하지 않습니다.

토론 #13

네, fragment를 사용했습니다. 사실상 로그인 페이지에서 사용한 태그와 스크립트가 똑같습니다.유일한 문제는 닻이 표시된 HREF가 서버에 있는 서버 스크립트를 가리키고 있다는 것이다. 왜냐하면 나는 이 스크립트를 설정하지 않았기 때문이다. 왜냐하면 나는 WAMP 창고에서 나의 로컬 호스트를 실행하기 때문이다.

토론 #14

JSFIDLE에 올려놓고 확인해 주시겠어요?

토론 #15

그것은 너와 매우 비슷하다.이것이 바로 Working on JSFiddle

토론 #16

JSFIDLE에서 페이지를 새로 고치고 맨 위에 텍스트 로고를 표시한 다음 링크를 클릭하면 텍스트가 새 페이지를 불러오기 때문에 표시가 취소됩니다.

토론 #17

네, 알겠습니다.이것은 정상적인 부탁이다.
네가 시도할 수 있는 또 다른 일은 네가 클릭

토론 #18

해서 html로 돌아갈 때 네가 필요로 하는 내용+제목만 되돌려줄 수 있다는 것이다.만약 pjax의 프레젠테이션 페이지를 보았다면http://pjax.heroku.com, 서버 응답은 확실히

토론 #19

등을 포함합니다. 이것은

토론 #20

로 시작합니다.zurka 123 네, 알겠습니다.실제로 응답은 <html>부터 시작해야 합니다.
서버를 다음과 같이 반환합니다.
<title>Zurka 123</title>
<div id="main_content" class="shadow">
    <section>
                <h1 class="name">Zurka 123<span class="shadow">11.09.2012.</span></h1>
        <div id="description">
            <div id="map">
            </div>
            <div id="description_text">Opis<br />
asd<br />
qwe<br />
a<br />
<br />
asd    asdas     sss<br />
<br />
<br />
asda<br />
wqeq<br />
weq</div>
            <div id="comments">
                <h2 class="info">Komentari: <span class="comments_num">2</span></h2>
                                <article class="comment" id="c_3">
                    <h1 class="c_autor"><a href="/desavanja/user/prikazi/1">Admin istrator</a> <span class="c_datum">(04.09.2012. 22:43:41)</span></h1>
                                        <p>asdasds</p>
                </article>
                                <article class="comment" id="c_4">
                    <h1 class="c_autor"><a href="/desavanja/user/prikazi/1">Admin istrator</a> <span class="c_datum">(05.09.2012. 00:37:39)</span></h1>
                                        <p>sdfds</p>
                </article>
                                                <article class="comment">
                    <p class="warning">Morate biti registrovan clan da bi mogli da komentarišete dešavanje.</p>
                </article>
                            </div>
            <script id="komentar_template" type="text/x-handlebars-template">
                <article class="comment" id="c_{{id}}">
                    <h1 class="c_autor"><a href="/desavanja/user/prikazi/{{user_id}}">{{user_naziv}}</a> <span class="c_datum">({{dodato_datuma}})</span></h1>
                    <span class="c_delete"></span>
                    <p>{{{komentar}}}</p>
                </article>
            </script>
        </div>
        <div id="info">
            <div class="sidebox">
                <h2 class="info">Informacije</h2>
                <ul class="info_ul">
                    <li><span class="label">Mesto:</span><span class="field">eliterasdas</span></li>
                    <li><span class="label">Drzava:</span><span class="field"><a href="/desavanja/kalendar/drzava/5">Srbija</a></span></li>
                    <li><span class="label">Grad:</span><span class="field"><a href="/desavanja/kalendar/grad/0"></a></span></li>
                    <li><span class="label">Adresa:</span><span class="field">Pristin&scaron;ka 15a</span></li>
                    <li><span class="label">Vreme pocetka:</span><span class="field">01:20</span></li>
                    <li><span class="label">Cena:</span><span class="field">100a</span></li>
                    <li><span class="label">Organizator:</span><span class="field">mirza</span></li>
                    <li><span class="label">Kapacitet:</span><span class="field">200a</span></li>
                    <li>
                                                <span class="label">Vrsta dešavanja:</span><span class="field"><a href="/desavanja/kalendar/kategorija/1" class="button">Žurke</a><a href="/desavanja/kalendar/kategorija/2" class="button">Koncerti</a></span>
                    </li>
                </ul>
            </div>
            <div class="sidebox">
                <h2 class="info">Kontakt</h2>
                <ul class="info_ul">
                    <li><span class="label">Korisnik:</span><span class="field"><a href="/desavanja/user/prikazi/1">Admin istrator</a></span></li>
                    <li><span class="label">Telefon:</span><span class="field">063</span></li>
                    <li><span class="label">E-Mail:</span><span class="field"><a href="mailto:[email protected]" class="button">Pošalji e-mail</a></span></li>
                    <li><span class="label">Web adresa:</span><span class="field"><a href="http://www.dsgnet.net" class="button" target="_blank">Link</a></span></li>
                </ul>
            </div>
            <div class="sidebox">
                <div class="ad"></div>
            </div>
        </div>
    </section>


<script type="text/javascript">
    $(document).ready(function() {
        alert("asdas");
        var map,
            map_container = document.getElementById("map"),
            markersArray = [];

        var marker = {
            init : function() {
                                var latlng = new google.maps.LatLng(44.022201, 20.908137099999976);

                var myOptions = {
                    zoom: 10,
                    center: latlng,
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                }

                map = new google.maps.Map(map_container, myOptions);

                marker.placeMarker(latlng);

            },

            placeMarker : function(location) {

                var map_marker = new google.maps.Marker({
                    position: location,
                    map: map
                });

                markersArray.push(map_marker);

            }

        }

        marker.init();


        $("body").on("click", ".c_delete", function() {

            if (!confirm("Jeste li sigurni da želite da izbrišete ovaj komentar ?")) return;

            var $this = $(this).parent();
            var c_id = $this.attr("id");
            c_id = c_id.replace("c_","");

            $.ajax({
                type: "POST",
                url: "/desavanja/kalendar/izbrisi_komentar",
                data: { desavanje_id : 34, komentar_id : c_id },
                dataType: "json",
                success: function(data) {
                    if (data.status) {
                        $this.slideUp(200, function() { $this.remove(); });

                        var comments_num = $(".comments_num");
                        comments_num.html(parseInt(comments_num.html())-1);
                    } else alert("Greška.");
                },
                error: function(e) {
                    alert("Greška, pokušajte ponovo: "+e.message);
                    comment.val("");
                }
            });

        });

        $("body").on("click", "#dc_btn", function() {
            var comment = $("#comment_text");
            if (comment.val() == "") return;

            $.ajax({
                type: "POST",
                url: "/desavanja/kalendar/dodaj_komentar",
                data: { desavanje_id : 34, komentar : comment.val() },
                dataType: "json",
                success: function(data) {
                    if (data.status) {
                        comment.val("");
                        data.dodato_datuma = new Date(data.dodato_datuma*1000);
                        data.dodato_datuma = formatDate(data.dodato_datuma);

                        var template = Handlebars.compile( $("#komentar_template").html() );
                        $("#comments article:last").before( template(data) );

                        var comments_num = $(".comments_num");
                        comments_num.html(parseInt(comments_num.html())+1);
                    } else alert("Greška, niste registrovani.")
                },
                error: function(e) {
                    comment.val("");
                    alert("Greška, pokušajte ponovo: "+e.message);
                }
            });

        });

        function leadingZero(number) {
            return number < 10 ? "0" + number : number;
        }

        function formatDate(date) {
            return date.getDate() + "." +
                leadingZero(date.getMonth()) + "."+
                leadingZero(date.getFullYear()) + ". " +
                leadingZero(date.getHours()) + ":" +
                leadingZero(date.getMinutes()) + ":" +
                leadingZero(date.getSeconds());
        }

    });
</script>
</div>
자바스크립트를 다음과 같이 변경합니다.

            $(document).ready(function() {
                $('a[data-pjax]').pjax('#main_content');
            });
JSFIDLE에서 이것을 보여줄 수 없습니다. 서버 응답이 바뀌고 있기 때문입니다.
아, 로그인 페이지에 <title> 과 같은 텍스트를 입력하여 홈 페이지를 표시합니다. (내비게이션 단추의 텍스트 중 하나로 사용합니다.)이것은 반드시 작용할 것이다.

토론 #21

고맙습니다. 사용할 수 있지만 새 div에 #main content를 포장하고 <title>해야 합니다. 왜냐하면 두 개의 #main content div가 있기 때문입니다.
이제 제목 메뉴를 활성화하는 방법을 찾아야 합니다.
고맙습니다, 점원.On Home네...가능할 거예요.기꺼이 돕겠습니다!

토론 #22

하하, 아직도 모르겠어요.모든 것이 정상적이지만, js는 불러오지 않고 내용과 제목만 응답합니다.그나저나 사갈사는 이 문제가 무엇인지 설명해 주시겠어요?이게 필요해.

좋은 웹페이지 즐겨찾기