我的函数不起作用，Ajax调用，JQuery，调用外部?我不知道

My function dont work, Ajax call,JQuery, calling outside ? I dont know

本文关键字：调用 外部 我不知道 JQuery Ajax 函数 不起作用 我的      更新时间：2023-09-26

如果你想了解我的问题，请阅读那个让我生气的糟糕代码的每一步：

所有这些的上下文都是一个API，所以我必须对外部JSon文件进行ajax调用。调用有效：我得到响应，我可以像我想要的那样管理数据。

jQuery(function($) {
  $.ajax({	
	        url: 'http://MY JSON URL/',
		contentType: "application/json; charset=windows-1252",
	        dataType: "json",
	        success: function(content) {
                  var api = content.contents.response // Dont care about this, it work.
                  var AnyDataFromJsonIWantToGet = api.data // Dont care about this, it work.
    $('#myAPI').html("Some HTML content, syntax checked" +
                    $('#mainbuy').html() 
                    + "Some HTML content, syntax checked");				
			},
			/* Error */
		    error: function(xhr, status, error){
		            alert("No Json" + xhr.status);
		    },
			
				    
		});

如您所见，我在$('#myAPI').html()中称$('#mainbuy').html().我的问题在$('#mainbuy').html()，但只有在$('#myAPI').html()调用时才会发生。这是$('#mainbuy').html()的主页HTML代码，我保留了我所有的<div class>和其他<div>原因，也许您会在其中找到我问题的根源，但是您稍后会看到为什么我认为它绝对与我的CSS技巧无关。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="mainbuy" style="display:none;">
                   <div class="coachbtn"><div class="dropup"><div id="buybtn"> 
                      <select class="selectpicker" data-style="btn-primary" id="pickhour" name="pickhour">
   						 <option value="1">1H</option>
   						 <option value="2" selected>2H</option>
  				 		 <option value="3">3H</option>
				 		 <option value="4">4H</option>
  					   </select> 
                    </div></div></div>
                    <div class="coachbtn2"><div id="buybtn2">
                       <a id="egglink" class="button button-large" style="width: 260px">Reserver</a>
                    </div></div>
                     
  
  <script type="text/javascript">
	   $(document).ready(function(){
           $('#pickhour').change(function(){
              pickhour1 = $(this).val();
              $("#egglink").attr("href", "http://my-link/" + pickhour1 + "/end/of/my/link/");
					 });
			    }); 
                </script>
                    </div>

所以，在这个：

-下拉选择框：ID "拣选小时"

-按钮（<a></a> with style）：ID"蛋链接"

  • 我的脚本曾经在我的选择框中获取所选值的.val()，并将其放在一个链接中，该链接.attr()我的按钮。

问题所在：

如果我在我的主页中显示选择框 + 按钮 + 脚本而不在其他地方调用它：它工作正常！

如果我想在$('#myAPI').html()中显示带有$('#mainbuy').html() <div id="mainbuy" style="display:none;">：结果是显示每个元素，但脚本不起作用，我的按钮上没有 HREF。

我不知道这是否重要，但我使用Fancybox打开$('#myAPI').html()：

<div id="openAPI" style="display:none;width:auto;height:auto;">
    <div id ='myAPI'>
</div></div>
<a class="hover-wrap fancybox-media" data-fancybox-group="video" title=" " href="#openAPI">

我对JavaScript不是很聪明，实际上我迷失了，它似乎很容易和工作，但它不是。 :(

感谢您的阅读，希望这里有人可以帮助我。

也许你的 DOM 没有更新（导致你的 AJAX 请求），试试这个：

$('#buybtn2').on('change' , '#pickhour' , function(){
    pickhour1 = $(this).val();
    $("#egglink").attr("href", "http://my-link/" + pickhour1 + "/end/of/my/link/");
});

我不知道这是否有效..

提前对不起我的英语不好。

抱歉不是"#buybtn2"而是"#buybtn"。

实际上，您尝试更改 href 属性，但此按钮没有任何 href 属性。也许这是你的问题。

尝试在您的按钮上添加 href ：

<div class="coachbtn2">
     <div id="buybtn2">
         <a id="egglink" class="button button-large" href="" style="width: 260px">Reserver</a>
     </div>
</div>

对于最新版本的jquery attr，指的是最初的html。 因此更改它不会更新 DOM。 尝试改用道具。

$('#buybtn2').on('change' , '#pickhour' , function(){
    pickhour1 = $(this).val();
    $("#egglink").prop("href", "http://my-link/" + pickhour1 + "/end/of/my/link/");
});
相关文章：