javascript-我想隐藏我创建的网页上的某些按钮

4sup72z8 于 2021-09-13 发布在 Java

关注(0)|答案(2)|浏览(247)

我制作了一个电子商务网站。因此，当下订单时，用户必须等待订单确认。因此，有两个按钮在订单未确认之前是无用的
javascript代码如下所示：

var docketDownlondLink = "--"; var rescheduled_pickupLink = "--";
                       if(ordertype == 'courier'){
                           $('#btnDownloadDockets').css('display','none');
                           $('#btnDownloadDockets').attr('data-orderid',order_id);
                           docketDownlondLink = '<a style="font-size: 14px;" href="https://s3-ap-southeast-1.amazonaws.com/cdn.geniebazaar.in/order/courierlabels/'+tracking_no+'.zip" class="" title="Download Docket"> <i class="fas fa-download"></i></a>';
                           rescheduled_pickupLink = '<a style="font-size: 14px;" href="/reschedulePickup/'+encoded_cart_id+'" class="" title="Reschedule Pickup"><i class="far fa-clock"></i> </a>';
                        }else{
                            $('#btnDownloadDockets').css('display','none');
                            $('#btnDownloadDockets').attr('data-orderid',"");
                        }

                       orderStatus = status;

                       if(address.trim() == ""){
                            if(typeof street != "undefined"){
                                address += street;
                            }

                            if(typeof landmark != "undefined"){
                                address += landmark;
                            }         

                            if(typeof postal_code != "undefined"){
                                address += " - "+postal_code;
                            }
                       }

                       if(typeof courier_code == 'undefined'){
                           courier_code = "";
                       }

                       if(description.trim() != ""){
                           itemname += "<br/>"+description;
                       }

                       if(mode_of_transport.trim() != ""){
                           itemname += "<br/> Mode: "+mode_of_transport;
                       }

                       if(courier_code != ""){
                           itemname += "<br/> Courier: "+courier_code.toUpperCase();
                       }

                       if(tracking_no.trim() != ""){
                           itemname += "<br/>Docket : "+tracking_no;
                       }

                       if(pickup_num.trim() != ""){
                           itemname += "<br/>Pickup :"+pickup_num;
                       }

                       if(remark != ""){
                           itemname += "<br/>Remark :"+remark;
                       }

                       if(typeof courierStatus != 'undefined'){
                           if(courierStatus == ""){
                               courierStatus = status;
                           }
                       }

                       var isFreeItem = 0;
                       if(amt <=0 && typeof couponCode != 'undefined'){
                           isFreeItem = 1;
                       }

                       var markup = "<tr>";

                        markup += "<td> <input type='checkbox' name='record' class='cart_id_input' id='cart_id_input_"+cartid+"' data-cart_item='"+itemname.replace(regexRemoveSpecialCharacters, '')+"' data-cart_id="+cartid+" value="+cartid+"> </td>"+
                                    "<td> <span style='text-decoration:"+textDecoration+"'>" + (itemname).replace(regexRemoveSpecialCharacters, '') + '</span> <br/> '+substitute_product_name.replace(regexRemoveSpecialCharacters, '')+' <input type="hidden" name="product[]" value='+escape(itemname)+' />  <input type="hidden" name="serviceid[]" value='+serviceid+' >  ';

                       if(cartorderType == 'courier'){
                           markup += "<a href='javascript:void(0);' data-cartid="+cartid+" class='viewCourierDetails'>View More</a>";
                       }
                       markup += "</td>";

                        markup += "<td>"+hsnCode+"</td>"            

                       if(isFreeItem == 1){
                           markup +="<td class='text-center'>" + quantity + ' <input type="hidden" name="qty[]" value='+escape(quantity)+' /> </td>';
                           markup +="<td class='text-center'> "+shippedQty+" <input type='hidden' name='shipped_qty[]' value="+shippedQty+" /> </td>"+
                                 "<td> Free <input type='hidden' name='price[]' value="+amt+" /> </td>"+
                                 "<td> Free <input type='hidden' name='gst[]' value="+cart_amount+" /> </td>";
                       }else{
                            if((status =="approval_pending" || orderType != 'genie') && shippedQty <= 0 ){
                                 markup +="<td class='text-center'><input type='number' name='qty[]' style='width:30%;' class='cart_quantity_input' data-cart_id="+cartid+" value="+escape(quantity)+" /> </td>";
                            }else{       
                                markup +="<td class='text-center'>" + quantity + ' <input type="hidden" name="qty[]" value='+escape(quantity)+' /> </td>';
                            }

                            markup +="<td class='text-center'> "+shippedQty+" <input type='hidden' name='shipped_qty[]' value="+shippedQty+" /> </td>"+
                                    "<td>" + amt + " <input type='hidden' name='price[]' value="+amt+" /> </td>"+
                                    "<td>" + cart_amount.toFixed(2) + " <input type='hidden' name='gst[]' value="+cart_amount+" /> </td>";
                        }

                         if(ordertype == 'courier'){
                                markup +="<td>" + courierStatus + " <input type='hidden' name='gst[]' value="+status+" /> </td>";
                         }else{
                             markup +="<td>" + status + " <input type='hidden' name='gst[]' value="+status+" /> </td>";
                         }

                         if(docketDownlondLink != "--"){
                            markup +="<td>" + docketDownlondLink+" | "+ rescheduled_pickupLink + "</td>";
                            $('#td-action').css('display','block');
                         }else{
                            $('#td-action').css('display','none');
                         }

                         markup +="</tr>";
                        $('#itemlist tbody').append(markup);
                   }
               }

所以我想要的是隐藏按钮，直到确认订单，并在确认后显示。有人能帮我吗？

JavaScript laravel Html css

来源：https://stackoverflow.com/questions/68544696/javascript-i-want-to-hide-certain-buttons-on-the-webpage-ive-created

2条答案

按热度按时间

hl0ma9xz1#

有许多不同的方法来实现这一点，这取决于您的需要。我将与你分享其中一个。
首先，我们需要定义如何知道订单已确认？我们正在从api中提取订单信息，还是我们有权访问该状态更改？
如果第一个答案是肯定的，我们可以这样做，您需要使用display none设置元素的基类，然后创建第二个名为 show 具有 display: block 或在您的布局中需要的任何显示

const getState = () => {
  const confirmation = fetch(...)
  if (confirmation) {
    const el = document.getElementById('#id')
    el.classList.add('show')
  }
}

赞(0）回复(0）举报 2021-09-13

3vpjnl9f2#

您可以运行一个小脚本来调用按钮

function myFunction() {
  var x = document.getElementById("myDIV");
  if (x.style.display === "none") {
    x.style.display = "block";
  } else {
    x.style.display = "none";
  }
}


# myDIV {

background-color: blue;
   border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
  border-radius:10px;
}
button {
  background-color: GREEN;
    border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  cursor: pointer;
  border-radius:10px;
}

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>

</style>
</head>
<body>

<button onclick="myFunction()">CONFIRM</button>
<button type="submit" id="myDIV">SUBMIT</button>

<script>

</script>

</body>
</html>

赞(0）回复(0）举报 2021-09-13

我来回答

javascript-我想隐藏我创建的网页上的某些按钮

2条答案

相关问题

热门标签

最新问答