如何使用href链接转到第二个选项(我有2个)

我指的是这个网站:gesher-jds.org/giving

当我单击“立即捐赠”时,href起作用,并且到达正确的位置,“立即捐赠,以后付款”选项也起作用。

但是我确实希望当我单击“立即捐赠,以后付款”选项时,它还会检查下面的“以后付款”选项并打开其他表格。我该怎么做?我仍然希望它转到相同的位置,但也要检查“以后付款”选项并显示其他表格。我尝试了几件事,但没有任何效果。

谢谢!



<?php /*  template name: Custom Form */ ?>
<?php get_header();?>
            <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
            <div class="gesher-sections">
                <div class="gesher-section">
                    <div class="container">
                        <div class="row">
                            <div class="col-md-12">
                                <div class="row">
                                    <div class="col-md-8">
                                        <h1><?php if (get_field('alternate_title')) the_field('alternate_title'); else the_title();?></h1>
                                        <div class="image-div">
                                            <?php the_post_thumbnail(); ?>
                                        </div>
                                        <br />
                                        <div class="gesher-content">
                                            <?php the_content();?>
                                            <div class="new-goal-form">
                                                <div class="donations">
                                                    <div class="row d-flex align-items-center">
                                                        <div class="multiplier col-lg-5">
                                                            <div class="whitebox">
                                                                <div class="heading">Your Donation</div>
                                                                <div class="row d-flex align-items-center">
                                                                    <div class="col-md-2 costed">$ <div>USD</div></div>
                                                                    <div class="col-md-10"><input type="text" id="sample-donation"/></div>
                                                                </div>

                                                            </div>
                                                            <div class="finaldonation">
                                                                <span>With Each Donation</span>
                                                                Gesher Jewish Day School Gets
                                                                <div class="multiplyresult">$0.00</div>
                                                            </div>
                                                            <a href="#myAnchor" rel="" id="anchor1">Donate Now</a>

                                                        </div>
                                                        <div class="col-lg-2 seperator">
                                                            OR
                                                        </div>
                                                        <div class="col-lg-5 multi-pay multiplier">
                                                         <div class="whitebox">
                                                                <div class="heading">Your Donation</div>
                                                                <div class="row d-flex align-items-center">
                                                                    <div class="col-md-2 costed">$ <div>USD</div></div>
                                                                    <div class="col-md-10"><input type="text" id="sample-donation2"/></div>
                                                                </div>

                                                            </div>
                                                            <div class="finaldonation">
                                                                <span>With Each Donation</span>
                                                                Gesher Jewish Day School Gets
                                                                <div class="multiplyresult2">$0.00</div>
                                                            </div>
                                                            <a href="#myAnchor" rel="" id="anchor1">Donate Now,Pay Later</a>


<!--<div class="modal fade bd-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
        <h3 class="modal-title" id="exampleModalLongTitle">Please Fill Following Information If You Want To Pay Later</h3>
      </div>
      <div class="modal-body">
        <?php echo do_shortcode('[contact-form-7 id="2703" title="Pay Later Form"]'); ?>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
      </div>
</div>
</div>
</div>-->
                                                        </div>
                                                    </div>
                                                </div>
                                            <div name="myAnchor" id="myAnchor">
                                                <?php
                                                    $valueform = get_field( "form_short_code" );
                                                    echo do_shortcode($valueform);
                                                ?>
                                                </div>
                                            </div>

                                        </div>
                                    </div>
                                    <div class="col-md-4 statstics">
                                        <div class="time-remaining">
                                            <h5>Time Remaining</h5>
                                            <div class="clockit">
                                                <div class="row bt">
                                                    <div class="col-6" id="days"></div>
                                                    <div class="col-6" id="hours"></div>
                                                </div>
                                                <div class="row tb">
                                                    <div class="col-6" id="minutes"></div>
                                                    <div class="col-6" id="seconds"></div>
                                                </div>
                                                <div class="dot"></div>
                                            </div>
                                        </div>
                                    <?php $valueid = get_field("form_id"); ?>
                                        <?php echo do_shortcode('[give_goal id="'.$valueid.'" show_text="true" show_bar="true"]') ?>
                                        <div class="goalcompletion">
                                            &nbsp;
                                        </div>

<div class="donors_info">
<div class="totalenteries"></div>
<?php
    $valueid = 2727;
    //Get donors based on forms IDs (can be single or multiple forms)
    if(function_exists('give_get_payments')) {
        $args = array(
            'give_forms' => $valueid,'number' => -1,);
        $donations = give_get_payments( $args );

        echo "<table id='dtab'>";
        echo "<thead>";
        echo "<th align='center'>" . 'Name' . "</th>";
        echo "<th align='center'>" . 'Amount' . "</th>";
        echo "</thead>";
        echo "<tbody>";
        $donors = array();
        $dtmp=array(); //tmp array
        foreach($donations as $donation) {
            //Now get donor information from this donation ("customer" aka "donor")
            $customer_id = give_get_payment_customer_id( $donation->ID );
            $customers  = new Give_Customer( $customer_id );
            $nameis = $customers->name;

            $amt = get_post_meta($donation->ID,'_give_payment_total',false);
            $donationAll = 0;
            foreach ($amt as $key => $value) { 
                $donationAll = $donationAll + $value;
            }
            //Write a tmp array with name as key and donation as value
            if(array_key_exists($nameis,$dtmp)) {
                //name already exists -> add donation value
                $dtmp[$nameis] = $dtmp[$nameis] + $donationAll;
            } else {
                //name is not in the array -> new array: key name -> donation
                $dtmp[$nameis] = $donationAll;
            }

            $donors[] = $nameis;
        }

        foreach ($dtmp as $key => $value) {
            //iterate the tmp array
            echo "<tr class='select'>";
            echo "<td align='left'>" . $key . "</td>";
            echo "<td align='center'>" . $purchaseis = "$" . $value . "</td>";
            echo "</tr>";
        }

        echo "</tbody>";
        echo "</table>";
    }   
?>
</div>


                                        <div class="time-remaining">
                                            <h5>Share With Your Friends</h5>
                                            <div class="slinks">
                                                <a onclick="window.open('https://www.facebook.com/sharer/sharer.php?u=<?php the_permalink(); ?>','Facebook Share','width=400,height=400')" target="popup" class="thisa" href="javascript:"> <i class="fab fa-facebook-square"></i> </a>
                                                <a onclick="window.open('https://twitter.com/intent/tweet?url=<?php the_permalink(); ?>','Twitter Share',height=400')" class="thisa" target="popup" href="javascript:"> <i class="fab fa-twitter-square"></i> </a>
                                                <a onclick="window.open('https://www.linkedin.com/cws/share?url=<?php the_permalink(); ?>','Linked In Share',height=400')" class="thisa" target="popup" href="javascript:"> <i class="fab fa-linkedin"></i> </a>
                                                <a onclick="window.open('https://plus.google.com/share?url=<?php the_permalink(); ?>','Google Plus Share',height=400')" class="thisa" target="_blank" href="javascript:"><i class="fab fa-google-plus-square"></i> </a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <?php endwhile; endif;?>


<script>
jQuery(document).ready(function(){
var donationPercentage = jQuery('.give-progress-bar').attr('aria-valuenow');
if (donationPercentage < 26){
    jQuery(".goalcompletion").html('<img src="https://www.gesher-jds.org/wp-content/themes/gesher/img/goal1.png" class="img-responsive" />');
}else if (donationPercentage > 25 || donationPercentage < 51){
    jQuery(".goalcompletion").html('<img src="https://www.gesher-jds.org/wp-content/themes/gesher/img/goal2.png" class="img-responsive" />');
}else if (donationPercentage > 50 || donationPercentage < 76){
    jQuery(".goalcompletion").html('<img src="https://www.gesher-jds.org/wp-content/themes/gesher/img/goal3.png" class="img-responsive" />');
}else if (donationPercentage > 75 || donationPercentage < 100){
    jQuery(".goalcompletion").html('<img src="https://www.gesher-jds.org/wp-content/themes/gesher/img/goal4.png" class="img-responsive" />');
}else if (donationPercentage == 100){
    jQuery(".goalcompletion").html('<img src="https://www.gesher-jds.org/wp-content/themes/gesher/img/goal5.png" class="img-responsive" />');
}
});
</script>   

<script type="text/javascript" src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" />
<script>
jQuery(document).ready( function () {
    var table = jQuery('#dtab').DataTable({
        "paging":   false,"info":   false,"scrollY":        "400px","scrollCollapse": true,});
    var trows = table.rows( '.select' ).count();
    jQuery(".totalenteries").html(trows + ' DONORS DONATED TO THIS CAUSE');

    jQuery("#sample-donation").keyup(function(){
        var keyValue = jQuery(this).val()*2;
        var keyValueOriginal = jQuery(this).val();
        console.log(keyValue);
        jQuery(".multiplyresult").html("$"+keyValue + ".00");



        if ( jQuery('#give-amount').length > 0 ) {
                jQuery('#give-amount')
                    .val(keyValueOriginal)
                    .trigger('blur');
        }

        /*jQuery("#give-amount").attr("value",keyValueOriginal + ".00");
        jQuery("#give-amount").attr("data-amount",keyValueOriginal);
        jQuery(".give-final-total-amount").html(keyValueOriginal + ".00");
        jQuery(".give-final-total-amount").attr("data-total",keyValueOriginal);
        jQuery("input[name=give-price-id]").val(0);*/
    });
    jQuery('.anchor2').click(function(){
        jQuery('#give-card-number-wrap-2676 input').removeAttr('required');
        jQuery('#give-card-cvc-wrap-2676 input').removeAttr('required');
        jQuery('#give-card-name-wrap-2676 input').removeAttr('required');
        jQuery('.card-expiration input').removeAttr('required');
        jQuery('#give_cc_fields-2676').hide();
    });
    jQuery(function($) {
        $(".give-donation-level-btn").on('click tap touchstart',function () {
            var amount=$(this).val();
            //var amountarr = amount.split(".");
            //amount = amountarr[0];
            $('#sample-donation').val(amount);
            var keyValue = $(this).val()*2;
            var keyValueOriginal = $(this).val();
            console.log(keyValue);
            $(".multiplyresult").html("$"+keyValue + ".00");
            /*alert(keyValueOriginal);

            $("#give-amount").attr("value",keyValueOriginal + ".00");
            $("#give-amount").attr("data-amount",keyValueOriginal);
            $(".give-final-total-amount").html(keyValueOriginal + ".00");
            $(".give-final-total-amount").attr("data-total",keyValueOriginal);*/
        });

    });
    jQuery(document).on('click','a[href^="#"]',function (event) {
    event.preventDefault();

    jQuery('html,body').animate({
        scrollTop: jQuery(jQuery.attr(this,'href')).offset().top
    },500);
});
//jQuery('#give-donation-level-button-wrap').insertBefore('.donations');

} );
</script>

<script>
// Set the date we're counting down to
var countDownDate = new Date("<?php the_field('donation_timer'); ?>").getTime();

// Update the count down every 1 second
var x = setInterval(function() {

    // Get todays date and time
    var now = new Date().getTime();

    // Find the distance between now and the count down date
    var distance = countDownDate - now;

    // Time calculations for days,hours,minutes and seconds
    var days = Math.floor(distance / (1000 * 60 * 60 * 24));
    var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
    var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
    var seconds = Math.floor((distance % (1000 * 60)) / 1000);

    // Output the result in an element with id="demo"
     document.getElementById("days").innerHTML = "<b>" + days +"</b>" + " Days";
     document.getElementById("hours").innerHTML = "<b>" + hours +"</b>" + " Hours";
     document.getElementById("minutes").innerHTML = "<b>" + minutes +"</b>" + "  Mins";
     document.getElementById("seconds").innerHTML = "<b>" + seconds +"</b>" + " Sec";

    // If the count down is over,write some text 
    if (distance < 0) {
        clearInterval(x);
        document.getElementById("demo").innerHTML = "EXPIRED";
    }
},1000);
</script>

<<script>   jQuery("#sample-donation2").keyup(function(){
        var keyValue = jQuery(this).val()*2;
        var keyValueOriginal = jQuery(this).val();
        console.log(keyValue);
        jQuery(".multiplyresult2").html("$"+keyValue + ".00");
        jQuery("#give-amount").attr("value",keyValueOriginal);

                if ( jQuery('#give-amount').length > 0 ) {
                jQuery('#give-amount')
                    .val(keyValueOriginal)
                    .trigger('blur');
        }

        /*jQuery("#give-amount").attr("value",keyValueOriginal);
        jQuery("input[name=give-price-id]").val(0);*/

    });
</script>
<style>
ul#give-donation-level-button-wrap li:last-child {
    display: none;
}
</style>

<?php get_footer();?>
lixinnan11 回答:如何使用href链接转到第二个选项(我有2个)

您可能需要防止javascript中链接的默认行为,它会在点击有效之前重定向。 阻止链接打开URL:

document.getElementById("myAnchor").addEventListener("click",function(event){
  event.preventDefault()
});

https://www.w3schools.com/jsref/event_preventdefault.asp

本文链接:https://www.f2er.com/3151615.html

大家都在问