弹出窗口正在工作，但改变了主页

Pop-up is working but changing the main page as well

本文关键字：改变 主页 工作 窗口      更新时间：2023-09-26

功能:在文本框中输入电话号码(例如:555-555-5555)。文本字段直接打印数字(由CSS隐藏)。然后Javascript通过ID获取该数字，并通过连字符将其分开，并将拆分的数组注入到FoneFinder URL搜索字符串中，以在弹出窗口中显示该站点的结果。

问题:弹出的工作很好，但是，当我点击链接产卵的链接，它在主页以及弹出打开。主页面不能改变

弹出代码在其他页面上运行良好，不会覆盖主页。它必须是如何javascript注入html链接到页面，这是搞砸了，但我不知道为什么。

任何帮助或见解将不胜感激。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<style>
#target_num_result {
    display: none;
}
#target_num_search {
    font-size: small;
}
</style>

<!-- NewWindow POP UP CODE -->
<script LANGUAGE="JavaScript">
  function NewWindow(mypage, myname, w, h, scroll) {
        var winl = (screen.width - w) / 2;
        var wint = (screen.height - h) / 2;
        winprops = 'height='+h+',width='+w+',top='+wint+',left='+winl+',scrollbars='+scroll+',resizable'
        win = window.open(mypage, myname, winprops)
        if (parseInt(navigator.appVersion) >= 4) { win.window.focus(); }
  }
</script>

<!-- Script to read the target phone number and split it by hyphens and show a Search link to Fonefinder.net -->
<script type='text/javascript'>//<![CDATA[
$(window).load(function(){
    $('#target_num').on('keyup', function() {
        var my_value = $(this).val();
        $('#target_num_result').html(my_value);
        var arr = my_value.split('-');
        $("#target_num_search").html("&nbsp;&nbsp;<a href=http://www.fonefinder.net/findome.php?npa=" + arr[0] + "&nxx=" + arr[1] + "&thoublock=" + arr[2] + "&usaquerytype=Search+by+Number&cityname= title=FoneFinder onclick=NewWindow(this.href,'FoneFinderLookup','740','680','yes');>!BETA!FoneFinder Search!BETA!</a>");
    });
});//]]> 
</script>

</head>
<body>
<form id="form1" name="form1" method="post" action="">
<table cellpadding="2" cellspacing="0" style="width: 100%">
    <tr>
        <td style="width: 180px">Phone #:</td>
        <td><label> <input class="text" type="text" name="target_num" id="target_num" /></label><span id="target_num_result"></span><span id="target_num_search"></span></td>
    </tr>
    </table>
 <label>
 <input class="button" type="submit" name="submit" id="submit" value="Create" />
 </label>
</form>
</body>
</html>

您需要添加的内容如下:

$('#target_num_search').on('click', 'a', function (event) {
    event.preventDefault();
    var url = $(this).attr('href');
    NewWindow(url,'FoneFinderLookup','740','680','yes');
})

这样你可以删除onclick属性并将函数调用移动到js。查看工作jsfield

当onlick事件发生时，您应该使用return false来阻止链接'href'的默认操作。

(请注意, -逗号操作符到任何函数返回…这只是一个hack。不要使用。)

顺便说一句,

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<style>
#target_num_result {
    display: none;
}
#target_num_search {
    font-size: small;
}
</style>

<!-- NewWindow POP UP CODE -->
<script LANGUAGE="JavaScript">
  function NewWindow(mypage, myname, w, h, scroll) {
        var winl = (screen.width - w) / 2;
        var wint = (screen.height - h) / 2;
        winprops = 'height='+h+',width='+w+',top='+wint+',left='+winl+',scrollbars='+scroll+',resizable'
        win = window.open(mypage, myname, winprops)
        if (parseInt(navigator.appVersion) >= 4) { win.window.focus(); }
  }
</script>

<!-- Script to read the target phone number and split it by hyphens and show a Search link to Fonefinder.net -->
<script type='text/javascript'>//<![CDATA[
$(window).load(function(){
    $('#target_num').on('keyup', function() {
        var my_value = $(this).val();
        $('#target_num_result').html(my_value);
        var arr = my_value.split('-');
        var html_tpl = "&nbsp;&nbsp;<a href=http://www.fonefinder.net/findome.php?npa=" + arr[0] + "&nxx=" + arr[1] + "&thoublock=" + arr[2] + "&usaquerytype=Search+by+Number&cityname= title=FoneFinder onclick='"return NewWindow(this.href,'FoneFinderLookup','740','680','yes'), false'" target='_blank'>!BETA!FoneFinder Search!BETA!</a>";
        $("#target_num_search").html(html_tpl);
    });
});//]]> 
</script>

</head>
<body>
<form id="form1" name="form1" method="post" action="">
<table cellpadding="2" cellspacing="0" style="width: 100%">
    <tr>
        <td style="width: 180px">Phone #:</td>
        <td><label> <input class="text" type="text" name="target_num" id="target_num" /></label><span id="target_num_result"></span><span id="target_num_search"></span></td>
    </tr>
    </table>
 <label>
 <input class="button" type="submit" name="submit" id="submit" value="Create" />
 </label>
</form>
</body>
</html>

相关文章：