doulin6761 2015-12-27 07:58
浏览 26

在网页上的“按钮”自我识别中使用JavaScript

I have a website in which I have placed specific buttons inside of articles and outside in the head/body/footer. What I plan to do is when a user clicks on the button the JavaScript code should find out if the button is located inside of an article or outside of it and send the information to my parent website using PHP's $_GET function. This is the code on the 'child' website..

<!-- Button code -->
<p id="test"></p>
<a id ="webs" href= "" onclick="jams(this);document.getElementById('test').frameBorder=0"; target="test"><button>Click me!</button> </a>

The JavaScript functions it calls.

<p id="demo"></p>


<script>
function jams(z) {
var origZ=z;
var found= false;
var sString;
while ( z.nodeName != "HTML"  && !found){
    var elements = z.getElementsByTagName('a');

    for(var i=0; i<elements.length; i++) {
        var input = elements[i] ;
        sString = input.getAttribute("href");

        found = sString.search(window.location.hostname) != -1;
     }
    z=z.parentElement;


    if ( z.nodeName != "HTML"  && z.nodeName !=                                                   "ARTICLE"){

     z=z.parentElement;
     var spString = (window.location.hostname);

         var link = "http://www.parentwebsite.com/one.php?id="+spString;
         origZ.href = link; 

    }     
}
var link = "http://www.parentwebsite.com/two.php?id="+sString;
origZ.href = link; 
}  
</script>

I have two pages on the parent website, page one.php receives the websites name (www.child.com) if the button is located outside of the article.
If the button is located within an article page two.php receives the articles URL.
Using PHP's $_GET Variable.

$success = $_GET["id"];

So when the user clicks the button on the webpage the button will call the jams script and it recognizes where the button is situated on the webpage and sends to either one.php the website-name OR two.php the articles URL.

The script works just fine when the button is situated within an article,
the href = 

http://www.parentwebsite.com/two.php?id=http://child-articles-url.com/

BUT it fails when it is outside of an article, the href 

http://www.parentwebsite.com/two.php?id=http://www.parentwebsite.com/one.php?id=http://www.child.com/

What it needs to give is just:

http://www.parentwebsite.com/one.php?id=http://www.child.com/

P.S I have used chrome's debugger while working with this.

Thanks in advance! :)

  • 写回答

1条回答 默认 最新

  • dongyan5815 2015-12-27 09:27
    关注

    I tried to solve your problem

    index.php

    <!DOCTYPE html>
<html>
<head>
    <title>Using JavaScript in “button” self recognition on webpage</title>
</head>
<body>
<!-- Your HTML CODE -->
<div class="aricle">
    <h2> Article Starts </h2>
        <a href="#" onclick="link(1);">This is inside Article</a>
    <h2> Article Ends </h2>
</div>
<br />
<a href="#" onclick="link(2);">This is inside Article</a>

<!-- Your JS CODE -->

<script type="text/javascript">
    function link(button) {

        if (button == 1) {
            //alert("button inside article");
            window.location.href='http://localhost/stackTest/one.php';
        } else if (button == 2) {
            //alert("button outside article");
            window.location.href='http://localhost/stackTest/two.php';
        }
    }
</script>
</body>
</html>

    one.php

    <h2>This is One</h2>

    two.php

    <h1>This is Two</h2>

    Hope this helps you to identify the buttons. and you can use the anchor (a) tags for displaying as a button instead using <button> tag inside <a>..</a> tag. If you are using Bootstrap simply use "Button" Class for <a>.

    评论

报告相同问题？

悬赏问题

  • ¥20 怎么用dlib库的算法识别小麦病虫害
  • ¥15 华为ensp模拟器中S5700交换机在配置过程中老是反复重启
  • ¥15 java写代码遇到问题，求帮助
  • ¥15 uniapp uview http 如何实现统一的请求异常信息提示？
  • ¥15 有了解d3和topogram.js库的吗？有偿请教
  • ¥100 任意维数的K均值聚类
  • ¥15 stamps做sbas-insar，时序沉降图怎么画
  • ¥15 买了个传感器，根据商家发的代码和步骤使用但是代码报错了不会改，有没有人可以看看
  • ¥15 关于#Java#的问题，如何解决？
  • ¥15 加热介质是液体，换热器壳侧导热系数和总的导热系数怎么算