Страница Facebook JavaScript: нельзя использовать функцию - PullRequest
Новая
       2

Страница Facebook JavaScript: нельзя использовать функцию

1 голос
/ 31 октября 2010

Я создаю пользовательскую страницу в Facebook, используя FBML и JavaScript на вкладке холста.

Я хочу сделать слайдер, как вы обычно делаете с jQuery, к сожалению, у Facebook нет поддержки jQuery (пока), поэтому я решил, что сделаю слайд с простым старым JavaScript.

После однократного использования функции slide() в консоли Firebug появляется ошибка «slide () не является функцией».

Вот код: 

<script>
    <!--
        function slide(reqPos){
            desSlideState = reqPos;
            curSlideState = getCurSlideState();
            toSlide = desSlideState - curSlideState;
            pxToSlide = toSlide * (-520);

            movCount = 0;
            timer = setInterval(function(){eSlide(slide, pxToSlide);},100);
        }
        function getCurSlideState(){
            slide = document.getElementById("slider");
            var slideLeft = slide.getStyle("left");
            var slideLeft = parseFloat(slideLeft);
            var slideState = slideLeft/-520;
            return slideState;
        }
        function eSlide(elemToMove, lengthToMove){
            curLeft = elemToMove.getStyle("left");
            curLeft = parseFloat(curLeft);

            newLeft = curLeft + (lengthToMove/10);
            elemToMove.setStyle("left", newLeft + "px");

            movCount++;

            if(movCount == 10){
                clearInterval(timer);
                return false;
            }
        }
    //-->
</script>

<div id="fb-wrapper">
    <h1>Loads Solutions LTD</h1>

    <div class="loads-nav-wrap">

      <div class="fb-nav" id="nav1"><a href="http://www.loads.co.il/hosting.php" onclick="slide(0); return false;">Server<br />Hosting</a><div></div></div>

      <div class="fb-nav" id="nav2"><a href="http://www.loads.co.il/dedicated.php" onclick="slide(1); return false;">Dedicated<br />Servers</a><div></div></div>

      <div class="fb-nav" id="nav3"><a href="http://www.vcp.co.il/" onclick="slide(2); return false;">Web Design<br />&Development</a><div></div></div>

      <div class="fb-nav" id="nav4"><a href="http://www.loads.co.il/vps.php" onclick="slide(3); return false;">VPS</a><div></div></div>

      <div class="fb-nav" id="nav5"><a href="http://www.loads.co.il/exchange.php" onclick="slide(4); return false;">Exchange MailBoxes</a><div></div></div>
</div>

<div id="content-slide">
    <div id="slider" style="left:0">
        <div class="slide-content">
            <h3 id="test-id">content1</h3>
        </div>
        <div class="slide-content">
            <h3>content2</h3>
        </div>
        <div class="slide-content">
            <h3>content3</h3>
        </div>
        <div class="slide-content">
            <h3>content4</h3>
        </div>
        <div class="slide-content">
            <h3>content5</h3>
        </div>
    </div>
</div>

Не беспокойтесь о том, что HTML не действителен, иначе Facebook не будет работать.

1 Ответ

5 голосов
/ 31 октября 2010

Эта строка перезаписывает вашу slide функцию: 

slide = document.getElementById("slider");

Вам нужно var, чтобы сделать ее локальной, например: 

var slide = document.getElementById("slider");

Без var он устанавливает его как глобальную переменную ... перезаписывая вашу slide функцию ранее. Всегда ставить var при объявлении локальной переменной, иначе это может привести к глобальным конфликтам, как это было здесь.

...