未定义javascript显示错误功能。

时间:2016-10-14 10:26:18

标签: javascript jquery html

Javascript代码:

<script>
$(document).ready(function(){
$("#verify").click(function(){
        if ($("#cval").val()==$("#captcha").text()){
          $("#pop").modal("hide");
          var id=$("#captcha").attr("data-id");
          if (_ths.hasClass("red")){
              $.post(base_url+"index.php/myad/removethumbs",{uniqueid:id},function(){
                _ths.removeClass("red");
              });  
          }
          else{
            $.post(base_url+"index.php/myad/addthumbs",{uniqueid:id},function(){
              _ths.addClass("red");
            });  
          }
          $("#captcha").val("");
        }
        else{
          $("#cval").val("");
          $("#cval").attr("placeholder","invalid captcha");
        }
      });
function thumb(id,ths){
    if (<?=$loggedin?>){
      $.post(base_url+"index.php/myad/addthumbs",{uniqueid:id});
      $(ths).addClass("red");
    }
    else{
        _ths=$(ths);
        var number = Math.floor(Math.random()*90000) + 10000;
        $("#captcha").attr("data-id",id);
        $("#captcha").text(number);
        $("#pop").modal("show");
    }
  };

  function staticthumb(id,ths){
    if (<?=$loggedin?>){
      if ($(ths).hasClass("red")){
          $.post(base_url+"index.php/myad/removethumbs",{uniqueid:id},function(){
            $(ths).removeClass("red");
          });  
      }
      else{
        $.post(base_url+"index.php/myad/addthumbs",{uniqueid:id},function(){
          $(ths).addClass("red");
        });  
      }
    }
    else{
      _ths=$(ths);
        var number = Math.floor(Math.random()*90000) + 10000;
        $("#captcha").attr("data-id",id);
        $("#captcha").text(number);
        $("#pop").modal("show");
    }           
  };
});
</script>

HTML code:

    <div class="col-sm-8" id="lists">
    <?php if(isset($products)):?>
          <?php foreach($products as $p):?>
            <div class="col-md-12">
          <div class="product-view row" style="border-bottom:1px solid #eee;margin-bottom:20px;padding:20px 0px 20px 0px;background:#f1f1f1">
            <div class="col-sm-3 col-md-3 col-lg-3">
              <?php $j = 0;?>
                <?php foreach($p['checkbox'] as $checkbox):?>
                  <?php if($j == 0):?>
                    <div class="large-image"> 
                        <img alt="#" src="<?php echo base_url();?>/uploads/<?php echo $checkbox['Image']?>" />
                        <div class="image-title"><span class="icon-thumbs-up" onclick="staticthumb(<?php echo $checkbox['UniqueID']?>,this);" id="thumb<?php echo $checkbox['UniqueID']?>" style="font-size:24px;"></span></div> 
                    </div>
                  <?php endif;?>
                  <?php $j++;?>
                <?php endforeach;?>
            </div>
            <div class="col-sm-6 col-md-6 col-lg-6"> 
              <div class="product-label">
                  <h4><?php echo $p["FullName"];?>, <?php echo $p["Area"];?></h4>
                  <h5 style="font-size:14px"><span class="icon-calendar"></span>  <?php echo $p["SaleDate"];?></h5>
                  <h5 style="font-size:14px"><span class="icon-clock"></span>
                  <?php for($i = 0; $i < count($p['StartTime']); $i++):?>
                      <?php echo $p['StartTime'][$i].'-'.$p['EndTime'][$i]?>
                  <?php endfor;?>
                  </h5>
                  <div data-balloon-length="fit" data-balloon=" <?php echo $p["Address1"].'-'.$p["Postal"];?>" data-balloon-pos="up"  ><h5 style="font-size:14px;width: 100%;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;"><span class="icon-home"></span>  <?php echo $p["Address1"].'-'.$p["Postal"];?></h5></div>
                  <div data-balloon-length="fit" data-balloon=" <?php echo $p["description"];?>" data-balloon-pos="up" ><h5 style="font-size:14px;width: 100%;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;"><span class="icon-file"></span>  <?php echo $p["description"];?></h5></div>
                  <!--<div class="panel-group accordion-simple" id="product-accordion">
                  <div class="panel" style="background:#f1f1f1;">
                    <div class="panel-heading"> <a data-toggle="collapse" data-parent="#product-accordion" href="#product-address"  class="collapsed"> <span class="arrow-down icon-arrow-down-4"></span> <span class="arrow-up icon-arrow-up-4"></span> Address </a> </div>
                    <div id="product-address" class="panel-collapse collapse">
                      <div class="panel-body"><h5 style="font-size:14px"><?php echo $p["Address1"];?></h5></div>
                    </div>
                  </div>
                  <div class="panel"  style="background:#f1f1f1;">
                    <div class="panel-heading"> <a data-toggle="collapse" data-parent="#product-accordion" href="#product-size" class="collapsed"> <span class="arrow-down icon-arrow-down-4"></span> <span class="arrow-up icon-arrow-up-4"></span> Description </a> </div>
                    <div id="product-size" class="panel-collapse collapse">
                      <div class="panel-body"><h5 style="font-size:14px"><?php echo $p["description"];?></h5></div>
                    </div>
                  </div>
                </div>-->
              </div>

            </div>
            <div class="col-sm-3 col-md-3 col-lg-3">
              <div class="product-label">
                  <h4>CATEGORY</h4>
                  <?php foreach($p['checkbox'] as $checkbox):?>
                    <h5 style="font-size:14px"><?php echo $checkbox['Product']?></h5>
                  <?php endforeach;?>
              </div>

            </div>
          </div>
          </div>
          <?php endforeach;?>
    <?php else:?>
      <h3 style="text-align:center">SORRY THERE IS NO ANY DATA IS AVAILABLE.</h3>
    <?php endif;?>

验证码验证的HTML代码:

  <div class="modal fade bs-example-modal-sm" id="pop" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
  <div class="modal-dialog modal-sm" role="document">
    <div class="modal-content">
    <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
      <h4 class="modal-title">Please verify captcha</h4>
    </div>
    <div class="modal-body">
      <h4 id="captcha" class="text-center"></h4>
      <hr>
      <div class="form-group">
        <input type="text" class="form-control" name="captcha" id="cval" placeholder="enter captcha">
      </div>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      <button type="button" class="btn btn-primary" id="verify">Verify</button>
    </div>
    </div>
  </div>
  </div>

当我点击拇指时,显示我的函数staticthumb未定义。但实际上你可以看到我写的函数staticthumb我声明了staticthumb函数,但它仍然显示错误所以请帮助我。现在我很无助所以请帮助我,并尝试解决我的问题,并提前感谢。

1 个答案:

答案 0 :(得分:0)

JavaScript中的函数声明具有Functional Scope,这意味着它只能从声明它的函数中访问。如果它未在函数中声明,则它在全局范围内。

您在匿名函数中声明了staticthumb函数,因此它只能在该范围内使用。最简单的解决方法是将函数声明移出匿名函数,这将污染您的全局变量空间(您通常希望避免这种情况,但这本身就是一个主题)

TL; DR;将您的staticthumb功能移到$ {(文档).ready之前的<script>标记后面的第一行。