Question

 <div class="modal fade" id="logoutModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title" id="exampleModalLabel">Ready to Leave?</h5>
          <button class="close" type="button" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">×</span>
          </button>
        </div>
        <div class="modal-body">Username or Password is incorrect.</div>
        <div class="modal-footer">
          <a class="btn btn-primary" href="login.html">Ok</a>
        </div>
      </div>
    </div>
  </div>

so i have this tag that is currently a button. When i click on this button it runs a display message.

How can i make this tag to automatically run when the page opens or reloads.

<a class="dropdown-item" href="#" data-toggle="modal" data-target="#logoutModal">Logout</a>;

Answer 1

click（）方法对元素执行单击，就像用户手动单击它一样。

在您的代码上添加ID：

create or replace PROCEDURE VMS_DETAILS_D_1 IS
LOG_D1 VARCHAR2(20);
BEGIN

/* IDENTIFY PARTITION */

SELECT partition_name into LOG_D1 FROM all_tab_partitions a WHERE table_name = 'LOG' AND TABLE_OWNER='OWNER1' and partition_position IN 
(SELECT MAX (partition_position-1) FROM all_tab_partitions b WHERE table_name = a.table_name AND a.table_owner = b.table_owner);

execute immediate 'DROP TABLE TAB1 PURGE';
COMMIT;

EXECUTE IMMEDIATE 'create table TAB1 Nologging as
select /*+ Parallel(20) */  TRANSACTIONID,TIME_STAMP from OWNER1.log partition('||LOG_D1||') 
where ( MESSAGE = ''WalletUpdate| Request for Estel Update is Processed'' or MESSAGE = ''Voucher Core request processed'')';

EXECUTE IMMEDIATE 'CREATE INDEX IDX_TAB1 on TAB1(TRANSACTIONID)';

DBMS_STATS.GATHER_TABLE_STATS (ownname => 'OWNER2' , tabname => 'TAB1',cascade => true, estimate_percent => 10,method_opt=>'for all indexed columns size 1', granularity => 'ALL', degree => 1);


DECLARE
   CURSOR resp_cur
   IS
        select TRANSACTIONID,to_char(max(TIME_STAMP),'DD-MM-YYYY HH24:MI:SS') TIME_STAMP from TAB1 
        where TRANSACTIONID in (select ORDERREFNUM from TAB2
        where ORDERREFNUM like 'BV%') group by TRANSACTIONID;
BEGIN
   FOR l IN resp_cur
   LOOP
      update TAB2 
      set TCTIME=l.TIME_STAMP 
      where ORDERREFNUM=l.TRANSACTIONID;
      COMMIT;
   END LOOP;
END;

end;

并使用js：

<a class="dropdown-item" href="#" data-toggle="modal" data-target="#logoutModal" id="example">Logout</a>

Answer 2

您可以在页面加载后使用触发器

$( document ).ready(function() {
    $(".dropdown-item").trigger( "click" );
});

Answer 3

根据您上面的评论...

我正在尝试填写用户输入错误凭据的表单将会弹出模式。

...也许这会有所帮助。如果不是，那么您需要弄清楚您要在问题中做什么。

在下面的代码段中，我有一个登录表单。输入错误的凭据后，将显示模式。

$("#login").click(function () {
    // Here you would do your check for correct credentials
    // Obviously you wouldn't want to do this in JS in production
    // I'm assuming there would be an AJAX request here that would validate the user's credentials
    // If valid, proceed. If not, call the modal.
    if ($(username).val() !== "blah" || $(password).val() !== "blah") {
  	// Username or password incorrect, show modal
    $("#modal").modal();
  } else {
  	alert("Login successful!");
  }
})

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>


Username: <input id="username" type="text" />
Password: <input id="password" type="password" />
<button type="button" id="login" class="btn btn-info">Login</button>

<div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Ready to Leave?</h5>
        <button class="close" type="button" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">×</span>
          </button>
      </div>
      <div class="modal-body">Username or Password is incorrect.</div>
      <div class="modal-footer">
        <a class="btn btn-primary" data-dismiss="modal">Try again</a>
      </div>
    </div>
  </div>
</div>

基本上，只要您希望模态自动显示（即不单击任何内容），就可以像这样调用它：

$("#idOfModal").modal();

如果要以编程方式隐藏或消除模态，可以通过将hide传递给modal函数来实现：

$("#idOfModal').modal("hide");

Answer 4

您可以使用$("#logoutModal").modal('show') 在$(document).ready(() => ...)

上

$(document).ready(function() {
  $("#myModal").modal('show');
});

<!-- begin snippet: js hide: false console: true babel: false -->

$(document).ready(function() {
  $("#logOut").modal('show');
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>

<div id="logOut" class="modal fade">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title">Are you sure you want to Logout?</h4>
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>

      </div>
      <div class="modal-body">
        <form>
          <button type="submit" class="btn btn-danger float-right">Yes</button>
        </form>
      </div>
    </div>
  </div>
</div>

如何制作html <a> tag run automatically

4 个答案: