链接在模板上的点上不起作用
[英]Links not working on point on my template
问题描述
I have template: http://serwer1356363.home.pl/pub/sample2/ (preview) 
我有模板： http : //serwer1356363.home.pl/pub/sample2/ （预览）
On the left there is a image with a laptop. 左侧是带有笔记本电脑的图像。 On the laptop there are points - which are links (I want make this clickable). 在笔记本电脑上有一些要点-就是链接（我想使它可单击）。
I would like to click the page to open the page (eg mbank.pl, wp.pl). 我想单击页面以打开页面（例如mbank.pl，wp.pl）。
How to do it? 怎么做？
My code: 我的代码：
<script type="text/javascript">
var pointCount = 0;
$(document).ready(function () {
$(".deleteMyAccount").click(function (e) {
e.preventDefault();
$('#dialog').modal('show');
});
$(".acceptRemoveAccount").click(function (e) {
window.location.href = "pl/editPhoto/removeMyAccount?recordId=5";
});
if ($('.checkboxHid1').is(':checked')) {
$(".button_save1").show();
} else {
$(".button_save1").hide();
}
$('#tags_1').tagsInput({width: 'auto'});
$('#tags_3').tagsInput({
width: 'auto',
autocomplete_url: 'pl/editPhoto/tags'
});
$(".checkboxHid1").click(function (event) {
if ($(this).is(":checked"))
$(".button_save1").show();
else
$(".button_save1").hide();
}
);
});
</script>
<div class="modal fade" id="errorWindow" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-front-popup">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">Proszę uzupełnić wszystkie pola oznaczone gwiazdką!</h4>
</div>
<div class="modal-footer modal-dialog-centered">
<button type="button" class="btn btn-default" data-dismiss="modal">Ok</button>
</div>
</div>
</div>
</div>
<div class="modal fade" id="dialog" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-front-popup">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">Czy na pewno chcesz usunąć to zdjęcie?</h4>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Anuluj</button>
<button type="button" class="btn btn-primary acceptRemoveAccount">Tak, skasuj to zdjęcie teraz</button>
</div>
</div>
</div>
</div>
<div class="modal fade" id="modalSubscriptionForm" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
aria-hidden="true">
<div class="modal-dialog modal-dialog-front-popup" role="document">
<div class="modal-content">
<div class="modal-header text-center">
<h4 class="modal-title w-100 font-weight-bold h4_redX">Zarób na dodanym zdjęciu...</h4>
</div>
<div class="modal-body mx-3">
<div class="md-form mb-12">
<i class="fas fa-user prefix grey-text"></i>
<select class="selectpicker select_type_1 drobne_select1 company_id fullSizeInput radiusInput" name="company_id" required="required">
<option value="">Wybierz firmę</option>
<option value="1">Firma Główna</option>
</select>
</div><br/>
<div class="md-form mb-12">
<i class="fas fa-user prefix grey-text"></i>
<input type="url" id="form3" class="form-control validate val1 radiusInput url" name="url" placeholder="Wpisz link do produktu*" maxlength="500" required="required">
</div><br/>
<div class="md-form mb-12">
<i class="fas fa-user prefix grey-text"></i>
<input type="text" id="form3" class="form-control validate val1 radiusInput description" name="description" maxlength="200" placeholder="Wpisz nazwę dodawanego produktu*" required="required">
</div><br/>
<div class="hide coorX"></div><div class="hide coorY"></div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default savePointBtn1" data-dismiss="modal">Anuluj</button>
<button type="button" class="btn btn-primary savePointBtn2 saveBtn">Zapisz</button>
</div>
</div>
</div>
</div>
<section class="section_100">
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6 ranking_zd ">
<div class="dodja1_left" id="image-holder">
<div class="scalize maxWidthImg imgpo">
<img src="assets/uploads/posts/thumbs/3qGzcIaxNsJrBgtdhMVLn5b0XeRU142Yi6ovuDWyAwpfFKlZm7E9k8HTSPQO.jpg"
class="img-responsive center dodja1_left_img target">
<script>
pointCount = pointCount + 1;
</script>
<div class="item-point" data-top="270"
data-left="212"
id="point42">
<div><a target="_blank" href="www.wp.pl" class="toggle tooltips"
title="nazwa" data-placement="top"
data-html="true" rel="tooltip"><span
class="pointFormat">1</span></a></div>
</div>
<script>
pointCount = pointCount + 1;
</script>
<div class="item-point" data-top="70"
data-left="344"
id="point43">
<div><a target="_blank" href="www.mbank.pl" class="toggle tooltips"
title="kalesony" data-placement="top"
data-html="true" rel="tooltip"><span
class="pointFormat">2</span></a></div>
</div>
</div>
<div class="usun_konto"><a class="deleteMyAccount"
href="#">usuń to zdjęcie</a></div>
</div>
</div>
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6 ranking_zd ">
<form id="saveForm" method="post" name="contactformXX" class="form validate clearfix validate-form"
action="pl/editPhoto?recordId=5"
enctype="multipart/form-data">
<input type="hidden" name="save" value="1">
<input type="hidden" name="recordId" value="5">
<select class="selectpicker select_type_1 drobne_select1 " name="category" required="required">
<option value="">Wybierz kategorię*</option>
<option selected="selected" value="2">Mięsny</option>
<option value="3">Odzieżowy</option>
<option value="1">Spożywczy</option>
</select>
<div class="form_group_my form_dodaj2">
<input type="text" id="tags_3" class="form-control kontakt_input tags" rows="4"
id="slowa_kluczowe1"
name="tags" placeholder="Wpisz słowa kluczowe*"
value="tag 2,tag 3,tag1">
</div>
<div class="form_group_my form_dodaj2">
<textarea required="required" class="form-control kontakt_input" rows="4" id="opis_zd2"
name="description"
placeholder="Dodaj opis zdjęcia*">opis zdjęcia :</textarea>
</div>
<div class=" padding_29"></div>
<br/><br/>
<div class="checkbox chackbox_tresc edycja_chcackbox_r">
<label>
<input type="checkbox" value="1" name="form_req1" disabled checked
class="checkboxHid1">
<span class="cr"><i class="cr-icon glyphicon glyphicon-ok"></i></span>
Akceptuję
<a href="pl/regulamin" target="_blank">
<span class="checkbox_color_red">regulamin</span>
</a>
.
</label>
</div><br/><br/><br/>
<div class="dodaj2_slogan"><span class="h4_red">Zarób na dodanym zdjęciu </span>oznaczając na
nim
firmę,
z której dany produkt pochodzi i dodaj link.
</div>
<div class="itemsBox">
<div class="obiect42">
<input type="hidden" value="270|212|nazwa|www.wp.pl|1"
name="points[]">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 padding_3 dodaj_top_1">
<div class="col-xs-2 col-sm-1 col-md-1 col-lg-1 padding_3 ">
<div class="dodaj2_link">
<div class="dodaj2_link_span">1</div>
</div>
</div>
<div class="col-xs-8 col-sm-10 col-md-10 col-lg-10 ">
<div class="dodaj2_link_firma">nazwa</div>
<div class="dodaj2_link_1"><a
href="www.wp.pl"
target="_blank">www.wp.pl</a>
</div>
</div>
<div class="col-xs-2 col-sm-1 col-md-1 col-lg-1 padding_3 ">
<div class="dodaj2_ikon7">
<img src="assets/images/ikon7.png"
class="img-responsive dodaj2_ikon7_img removeMe"
id="42">
</div>
</div>
</div>
<div class="clear"></div>
<hr class="hr">
</div>
<div class="obiect43">
<input type="hidden" value="70|344|kalesony|www.mbank.pl|1"
name="points[]">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 padding_3 dodaj_top_1">
<div class="col-xs-2 col-sm-1 col-md-1 col-lg-1 padding_3 ">
<div class="dodaj2_link">
<div class="dodaj2_link_span">2</div>
</div>
</div>
<div class="col-xs-8 col-sm-10 col-md-10 col-lg-10 ">
<div class="dodaj2_link_firma">kalesony</div>
<div class="dodaj2_link_1"><a
href="www.mbank.pl"
target="_blank">www.mbank.pl</a>
</div>
</div>
<div class="col-xs-2 col-sm-1 col-md-1 col-lg-1 padding_3 ">
<div class="dodaj2_ikon7">
<img src="assets/images/ikon7.png"
class="img-responsive dodaj2_ikon7_img removeMe"
id="43">
</div>
</div>
</div>
<div class="clear"></div>
<hr class="hr">
</div>
</div>
<div class="form-group ">
<button type="submit"
class="btn btn-danger kontakt_button margin_50 button_mop_r_poczta button_save1 hideButton">
Zapisz zmiany
</button>
</div>
</form>
</div>
</div>
</div>
</section>
<a href="" class="btn btn-default btn-rounded mb-4 formAdd" data-toggle="modal" data-target="#modalSubscriptionForm"
style="display:none"></a>
<script type="text/javascript">
$(document).ready(function () {
$('.imgpo').click(function (e) {
// var posX = $(this).position().left, posY = $(this).position().top;
// $('.coorX').html((e.pageX - posX - 10));
// $('.coorY').html((e.pageY - posY - 10));
var offset = $(this).offset();
$('.coorX').html((e.pageX - offset.left - 10));
$('.coorY').html((e.pageY - offset.top - 10));
$(".tooltip").tooltip("hide");
$('.formAdd').click();
});
$(document).on("click", ".removeMe", function () {
var number = $(this).attr('id');
$('#point' + number).remove();
$('.obiect' + number).remove();
});
$('.saveBtn').click(function (e) {
if ($('.description').val().length == 0 || $('.url').val().length == 0 || $(".company_id option:selected").val().length ==0) {
// $('#errorWindow').modal('show');
alert('Proszę uzupełnić wszystkie pola oznaczone gwiazdką!');
e.preventDefault();
return false;
}
e.preventDefault();
var url = $(".url").val(); // url
var description = $(".description").val(); // description
var company_id = $(".company_id option:selected").val(); // company_id
var cX = $(".coorX").text();
var cY = $(".coorY").text();
var random = (Math.floor(Math.random() * 999999999999)) * 234;
pointCount = pointCount + 1;
var newPoint = "<div class='item-point' data-top='" + cY + "' data-left='" + cX + "' id='point" + random + "'>" +
"<div>" +
"<a href='"+url+"' class='toggle tooltips' title='" + description + "' data-placement='top' data-html='true' rel='tooltip'><span class='pointFormat'>" + pointCount + "</span></a>" +
"</div>" +
"</div>";
var nextObjNumber = $(".itemsBox").children("div").length + 1;
// var newObject = "<div class='obiect" + random + "'>Obiect " + random +
// "<div class='removeMe' id='" + random + "'>X</div>" +
// "</div>";
var newObject = "<div class='obiect" + random + "'>" +
"<input type='hidden' value='"+ cX +"|"+ cY +"|"+description+"|"+url+"|"+company_id+"' name='points[]'>" +
"<div class='col-xs-12 col-sm-12 col-md-12 col-lg-12 padding_3 dodaj_top_1'>" +
"<div class='col-xs-2 col-sm-1 col-md-1 col-lg-1 padding_3 '>" +
"<div class='dodaj2_link'><div class='dodaj2_link_span'>" + pointCount + "</div>" +
"</div></div><div class='col-xs-8 col-sm-10 col-md-10 col-lg-10'>" +
"<div class='dodaj2_link_firma'>"+description+"</div>" +
"<div class='dodaj2_link_1'><a href='"+url+"' target='_blank'>"+url+"</a></div></div>" +
"<div class='col-xs-2 col-sm-1 col-md-1 col-lg-1 padding_3 '>" +
"<div class='dodaj2_ikon7'>" +
"<img src='assets/images/ikon7.png' class='img-responsive dodaj2_ikon7_img removeMe' id='" + random + "'></div></div></div><div class='clear'></div><hr class='hr'></div>";
$(".scalize").append(newPoint); // inserting new point
$(".itemsBox").append(newObject); // inserting new object
$('.scalize').scalize({
styleSelector: 'circle',
animationPopoverIn: 'flipInY',
animationPopoverOut: 'flipOutY',
animationSelector: 'pulse2'
});
const $tooltip = $('.tooltips');
$tooltip.tooltip({
html: true,
trigger: 'click',
placement: 'top',
});
$tooltip.on('show.bs.tooltip', () => {
$('.tooltip').not(this).remove();
});
$tooltip.on('click', (ev) => {
ev.stopPropagation();
});
$("#modalSubscriptionForm").modal("hide");
$(".url").val("");
$(".description").val("");
$(".company_id").val("").change();
});
$('.scalize').scalize({
styleSelector: 'circle',
animationPopoverIn: 'flipInY',
animationPopoverOut: 'flipOutY',
animationSelector: 'pulse2'
});
$('.tooltips').on('click', (ev) => {
ev.stopPropagation();
});
});
$(function () {
$(document).tooltip({
position: {
my: "center top+20",
at: "center"
},
content: function () {
return $(this).prop('title');
}
});
});
</script>
Why does not it work (it does not redirect after clicking on the selected page)? 为什么它不起作用（单击所选页面后它无法重定向）？
Does anyone know how to fix it? 有谁知道如何修理它？
Please help 请帮忙
2 个解决方案
解决方案1
0 2019-02-01 20:52:16
If you don't include "http://", "https://", or even just "//" at the beginning of the URL in the href tag it will be treated as a relative URL (eg http://serwer1356363.home.pl/pub/sample2/www.wp.pl ). 如果您在href标记中URL的开头不包括“ http：//”，“ https：//”，甚至不包括“ //”，它将被视为相对URL（例如， http：/ /serwer1356363.home.pl/pub/sample2/www.wp.pl ）。
Add the protocol to the beginning of the link to make the links function correctly. 将协议添加到链接的开头，以使链接正常运行。
解决方案2
0 2019-02-01 20:59:07
It looks like you are blocking the event here: 您似乎在此处阻止了该事件：
$('.tooltips').on('click', (ev) => {
ev.stopPropagation();
});
Try to comment that block out and try changing the following block of your code: 尝试注释掉该块，然后尝试更改代码的以下块：
$(document).ready(function () {
$('.imgpo').click(function (e) {
// var posX = $(this).position().left, posY = $
[...]
$('.formAdd').click();
});
by removing the ";" 通过删除“;” at the end adding the following directly to the last colsing bracket ")": 最后，将以下内容直接添加到最后一个括号“）”中：
.children().click(function() {
return false;
});
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.
相关问题
跳转链接在我的网站上不起作用 - Jump Links not working on my Website
为什么链接在我的网页上不起作用 - Why are the links not working on my webpage
我的菜单链接在wordpress上不起作用 - My menu links are not working on wordpress
我的jQuery模板无法正常工作 - my jQuery template is not working
为什么我的下拉菜单链接无效 - Why my links for Dropdown menu not working
我的下拉菜单中的链接不起作用 - The links in my drop down menu are not working
我的 jquery 代码在 ejs 模板中不起作用 - My jquery code is not working inside an ejs template
jQuery UI主题无法与我的模板CSS一起使用 - jquery ui theme not working with my template css
我的href链接在ajax调用中包含时不起作用 - My href links not working when contained within ajax call
为什么我的 html 链接在“Owl Carousel”中不起作用 - Why aren't my html links working in 'Owl Carousel'
相关标签