需要帮助让这个Javascript字符串正常工作吗

需要帮助让这个Javascript字符串正常工作吗,javascript,jquery,Javascript,Jquery,以下是我的工作内容: <script> $(document).ready(function() { $("#cf7_controls").on('click', 'span', function() { $("#cf7 img").removeClass("opaque"); var newImage = $(this).index(); $("#cf7 img").eq(newImage).addClass("opaque"); $("#c

以下是我的工作内容:

  <script>

  $(document).ready(function() {

  $("#cf7_controls").on('click', 'span', function() {

  $("#cf7 img").removeClass("opaque");

  var newImage = $(this).index();

  $("#cf7 img").eq(newImage).addClass("opaque");

  $("#cf7_controls span").removeClass("selected");

  $(this).addClass("selected");

  });

  });

  </script>   <div class="row">
    <div class="span 6">
        <div id="cf7" class="shadow">
            <img class='opaque' src="/img/Cirques.jpg" />
            <img src="/img/ClownFish.jpg" />
            <img src="/img/Stones.jpg" />
            <img src="/img/Summit.jpg" />
        </div>
        <p id="cf7_controls">
            <span class="selected">Image 1</span>
            <span>Image 2</span>
            <span>Image 3</span>
            <span>Image 4</span>
        </p>
    </div>
    <div class="span 6">
        <div id="cf7" class="shadow">
            <img class='opaque' src="img/Cirques.jpg" />
            <img src="img/ClownFish.jpg" />
            <img src="img/Stones.jpg" />
            <img src="img/Summit.jpg" />
        </div>
        <p id="cf7_controls">
            <span class="selected">Image 1</span>
            <span>Image 2</span>
            <span>Image 3</span>
            <span>Image 4</span>
        </p>
    </div>

$(文档).ready(函数(){
$(“#cf7_控件”)。在('click','span',function()上{
$(“#cf7 img”).removeClass(“不透明”);
var newImage=$(this.index();
$(“#cf7 img”).eq(newImage).addClass(“不透明”);
$(“#cf7_控制范围”).removeClass(“选定”);
$(此).addClass(“选定”);
});
});

图1 图2 图3 图4

图1 图2 图3 图4

我从你的电脑里提取了这个密码

不幸的是,它不能正常工作。我的WIP的现场演示可以在

google chrome中的错误是: 未捕获引用错误:$未定义marc-with-a-c.com/:97


谢谢你的帮助

页面中没有jQuery库

在脚本元素之前添加要包含jQuery的行:

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script>
    $(document).ready(function() {

        $("#cf7_controls").on('click', 'span', function() {
            $("#cf7 img").removeClass("opaque");

            var newImage = $(this).index();

            $("#cf7 img").eq(newImage).addClass("opaque");
            $("#cf7_controls span").removeClass("selected");
            $(this).addClass("selected");
        });
    });
</script>

$(文档).ready(函数(){
$(“#cf7_控件”)。在('click','span',function()上{
$(“#cf7 img”).removeClass(“不透明”);
var newImage=$(this.index();
$(“#cf7 img”).eq(newImage).addClass(“不透明”);
$(“#cf7_控制范围”).removeClass(“选定”);
$(此).addClass(“选定”);
});
});
您需要包含jquery

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 

这实际上是使用
jquery
编写的代码。 您必须将代码引用到jquery框架,如:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
并引用您的代码

<script type = "text/javascript" src = "changeThisToThePathWhereYouSaveTheDownloadedJqueryFramework"></script>

<script type = "text/javascript">
    //your actual code here
</script>

//您的实际代码在这里
<script type = "text/javascript" src = "changeThisToThePathWhereYouSaveTheDownloadedJqueryFramework"></script>

<script type = "text/javascript">
    //your actual code here
</script>