Question

我想知道这个链接会调用我想要的功能吗？

<a href="http://catalog.bitsltd.us/power_strips#replaced" onclick="document.getElementById('caShip').function caShip()" id="caShip">Some Text</a>

这是我想要打电话的功能......谁能告诉我为什么它也不起作用？

<script type="text/javascript">
$(function caShip(){
    $('#caShip').replaceWith('Some HTML (the new HTML has an id of replaced)');
});
</script>

单击链接时，它会转到href，它是同一页面和ID，但它不会替换＆lt; a＆gt;使用新的HTML，这是一个＆lt; div＆gt;？

更新：这是工作代码：

JS

<script type="text/javascript">
$(document).ready(function(){
    //Hide Canadian Information
    $('.locationDiv').hide();

    //bind the links click events
    $('.locLink').click(function(){       
        $('#1').hide();
        $('#desc_' + $(this).attr('title')).show();
    });
});     

</script>

HTML

<a href="javascript:void(0);" title="can" class="locLink" id="1">Canadian Customers Click Here Before Ordering!</a>
<div id="desc_can" class="locationDiv">
    <table class="contentpaneopen">
      <tr>
        <td class="contentheading" width="100%">Attention Canadian Customers!
        </td>
      </tr>
    </table>

    <table class="contentpaneopen">
      <tr>
        <td valign="top" >
        <span class="body">Please note that there are fees associated with shipping to Canada from the US that are <b><u><i><font color="red">NOT</font></i></u></b> included in the cost of the shipping or the cost of the unit. These cost are to be paid for by the purchaser. Here are some tips for shipping to Canada:
        <br />
        <br />
        -USPS methods are cheap but very unreliable. <b>Border fees</b> are not charged using USPS, only UPS or Fed Ex (which are the most reliable).
        <br />
        -<b>Customs fees</b> can sometime run <b>up to 50%</b> of the purchase price (UPS/FedEx).
        <br />
        -Smart Strips are available from a Canadian dealer. Visit our <a href="index.php?Itemid=146" title="Store Locator" target="_blank">Store Locator</a> to find a local seller.
        <br />
        -Customers with a UPS or FedEx account may ship on their account and assume all fees with no delays.
        <br />
        -Canadian customers selecting UPS or FedEx will have to pick the package up at their local station and pay the fees. So you order it online, but still have to drive and pay to pick it up unless you used your own UPS/Fed Ex account.</span>
        </td>
      </tr>
    </table>
</div>

我没有使用CSS，因为没有它我就可以实现我所需要的。感谢所有试图帮助我的人!!!。

Answer 1

没有。

删除内联onclick属性，然后执行此操作：

<script type="text/javascript">
$(function(){
    $('#caShip').click(function() {
        $(this).replaceWith('<div id="' + this.hash.slice(1) + '">some HTML</div>');
           // uncomment the next line if you want the hash to actually appear.
        // window.location.hash = this.hash;

           // prevent the page from reloading
        return false;
    });
});
</script>

如果您确实想要内联，那么您可以这样做：

<a href="http://catalog.bitsltd.us/power_strips#replaced" onclick="caShip.call(this);" id="caShip">Some Text</a>


<script type="text/javascript">
function caShip(){
    $(this).replaceWith('<div id="' + this.hash.slice(1) + '">some HTML</div>');
}
</script>

编辑： 修正了使用Anchor元素中的hash来创建具有该ID的新元素，因为用于替换的文本似乎意味着的

Answer 2

<a href="http://catalog.bitsltd.us/power_strips#replaced" onclick="caShipFunc();" id="caShip">Some Text</a>


<script type="text/javascript">
  function caShipFunc(){
      $('#caShip').replaceWith('Some HTML (the new HTML has an id of replaced)');
  }
</script>

Answer 3

由于你正在使用jQuery，你应该这样做：

<a href="http://catalog.bitsltd.us/power_strips#replaced" id="caShip">Some Text</a>

的jQuery

<script type="text/javascript">
$(function(){       
    $('#caShip').click(function() {
        if($(this).attr('href').indexOf("#") != -1) {
            $('#caShip').replaceWith('<div>Test</div>');
        }
    });
});
</script>

编辑：更新了jQuery以解决您的评论。这适用于我的基本测试。

Answer 4

你滥用jQuery而不是实际声明一个函数。

编写$(function someName() { ... })创建一个命名函数表达式并将其传递给$函数。它没有声明可重用的功能;你不能写someName()。

此外，您在onclick处理程序中的调用完全错误为了调用一个函数，你应该调用它（onclick="caShip();"）;您无法将其与getElementById结合使用。

执行此操作的正确方法是使用jQuery添加click处理程序：

$(function() { 
    $('#caShip').click(function() {
        $(this).replaceWith('Some HTML (the new HTML has an id of replaced)');
    });
});

Answer 5

试试这个......

<强> HTML

<a href="#replaced" id="caShip">Some Text</a>

<强> JS

$('#caShip').click(function(){
    $(this).text('Some HTML (the new HTML has an id of replaced)');
});

http://jsfiddle.net/8bUKs/1/

使用<a> to run a function()</a>

5 个答案: