将 Javascript 的 URL 输出插入 HTML 作为 HREF

Question

我的网站上有一个表单，由访问者提供输入。提交后，他们会根据输入重定向到 Javascript 生成的 URL。

因此说明：如果他们将 Data1 和 Data2 作为输入，他们将被重定向到 www.example.com/ajaData1+Data2

实际上，我不想将它们重定向到任何 URL。我希望他们在单击提交按钮后得到一个 href 来查看，以便他们可以选择是否要转到该 URL。

这是我的 JavaScript

<script type="text/javascript">function goToPage(){
var date = $('input[name=date]:checked').val();
var time = $('input[name=time]:checked').val();
var subject = $('input[name=subject]:checked').val();
window.location.href ="http://bay02.calendar.live.com/calendar/calendar.aspx?rru=-"+date+"-"+time+"-"+subject+"-";}</script>

而这个就是我要修改的html代码。我的问题是如何将 javascript 的输出插入 HTML 的 href 部分？

<div class="group submit">
                <label class="empty"></label>
                <div><input name="submit" type="submit" onclick="goToPaget()" value="Get your appointment!"/></div>
            </div>


            <div id="form-message" class="message hide">
                Thank you for your request
            <div id="output" class="message hide "></div>

                <h4><a href="**SO HERE I WANT TO PUT THE OUTPUT OF THE JAVASCRIPT**" title="Add To Calender">Add To Calender</a></h4>

            </div>

Answer 1

类似这样的：

document.querySelection("div#form-message h4 a").setAttribute(
    "href",
    PUT YOUR VALUE HERE
);

Answer 2

在从用户输入生成字符串后，使用 jQuery 选择器设置锚点的href 的解决方案：

$('.group.submit').on('click', 'input[type="submit"]', function(){
    var date = $('input[name=date]:checked').val();
    var time = $('input[name=time]:checked').val();
    var subject = $('input[name=subject]:checked').val();
    var link = "http://bay02.calendar.live.com/calendar/calendar.aspx?rru=-"+date+"-"+time+"-"+subject+"-";

    $('a[title="Add To Calender"]').attr('href', link);
    $('#output').removeClass('hide');
}))

将此代码添加到您的脚本中，它应该会生成适当的链接并将 href 分配给您的“添加到日历”锚。

Answer 3

也许你可以这样做：

<script>
$(document).ready(function(){
        $('#modalon').click(function() { 
            $.ajax({
            $('#imgloada4b').hide(); // hide old image
            var urload = "<?php bloginfo('template_url') ?>/img/loading.gif";
            $('#modal1Desc').html("<img href="/img/loading.gif" id='imgloada4b' src='"+urload+"'>"); // show new
            });
        });
});
</script>

很简单的解决方法，不是绝对好，但是解决方法，先把旧图片隐藏，再在图片的父元素中添加一张。