Como editar um título da caixa de alerta JavaScript?

168

Estou gerando um alerta JavaScript com o seguinte código na página C # .NET:

Response.Write("<script language=JavaScript> alert('Hi select a valid date'); </script>");

Ele exibe uma caixa de alerta com o título do cabeçalho como "Mensagem da página da web".

É possível modificar o título?

javascript alert subash
fonte

Eu acho que a pergunta era para JavaScript, que é compatível com todas as plataformas e navegadores e não para VBScript que é uma coisa estritamente IE e Windows para seu uso é limitado a apenas Windows

UserTursty

2

possível duplicata do título

Sjoerd

2

Você sabe que os alertas podem ser facilmente desativados pelo usuário? Você NÃO deve confiar neles!

toesslab 29/08/14

259

Não, você não pode.

É um recurso de segurança / anti-phishing.

Pierreten
fonte

22

Embora seja uma resposta e seja verdade, determinamos que você pode criar sua própria versão de alerta e ele fará o que quiser. Um modal simples e substitui a chamada da função de alerta.

Fallenreaper

1

Como isso é um recurso de segurança / anti-phishing? Estou curioso, sem discutir.

Tim

1

@ Tim Presumivelmente, seria mais fácil simular outro site se seus alertas não dissessem ao usuário de que URL eles se originavam; a proibição dessa personalização força o JavaScript a informar ao usuário que não é uma mensagem legítima.

Hidrotermal

@Hidrotérmica Por curiosidade, o comportamento do alerta não pode ser simulado pelo CSS agora? Em caso afirmativo, ainda é uma grande ameaça permitir que você altere os títulos dos alertas modais?

21715 Josh

6

@ Josh Você pode se aproximar com muito trabalho duro, mas os alertas nativos do navegador têm um comportamento que não pode ser simulado, como congelar o restante do navegador, flutuar na parte superior da interface do navegador e funcionar como uma janela separada que pode ser arrastado para fora da tela do navegador. É muito difícil criar uma réplica convincente, principalmente porque o alerta de cada navegador parece diferente.

Hydrothermal

65

Não, não é possível. Você pode usar uma caixa de alerta javascript personalizada.

Encontrei um bom usando jQuery

Diálogos de alerta do jQuery (alertas, confirmação e solicitações de substituição)

rahul
fonte

4

Obrigado, mas não estou interessado em usar a caixa de alerta personalizada

subash

20

A razão pela qual você não pode alterar o título, a propósito, é impedir que sites mal-intencionados induzam o usuário a pensar que o alerta é do sistema operacional ou de qualquer outra coisa.

benzado

1

NOTA: Outro usuário tentou editar esta resposta para indicar que o link fornecido levava a um site onde o malware foi detectado.

Sem ofensa, mas esses alertas parecem muito feios. O SweetAlert é muito mais bonito que isso.

Shashwat 16/08/19

32

Você pode fazer isso no IE:

<script language="VBScript">
Sub myAlert(title, content)
      MsgBox content, 0, title
End Sub
</script>

<script type="text/javascript">
myAlert("My custom title", "Some content");
</script>

(Embora eu realmente desejasse que você não pudesse.)

Chris Fulstow
fonte

53

Todos nós desejamos o mesmo

rahul

@ Chris Fulstow o que pode ser uma solução para esta questão

Tom

1

Eu amo o vbscript, desejo que o vbscript seja padronizado junto com o javascript. Dessa forma eu posso script sem a confusão de maiúsculas e minúsculas, e todos os browers populares obedeceria a minha comandos MWHAHAHA

Ronnie Matthews

3

Wow um comentário tem mais votos que a resposta ... para o destacamento de parte da resposta

Marvin Thobejane

11

Substitua a função javascript window.alert ().

window.alert = function(title, message){
    var myElementToShow = document.getElementById("someElementId");
    myElementToShow.innerHTML = title + "</br>" + message; 
}

Com isso, você pode criar seu próprio alert() função. Crie uma nova caixa de diálogo 'legal' (a partir de alguns elementos div).

Testado trabalhando no chrome e webkit, não tenho certeza dos outros.

Derk Jochems
fonte

1

o que é someElementId? qual tag eu quero dizer?

Pramod Setlur

1

someElementIdé o ID que você definiu como elemento HTML.

James P.

11

Encontrei este Sweetalert para personalizar javascript da caixa de cabeçalho.

Por exemplo

swal({
  title: "Are you sure?",
  text: "You will not be able to recover this imaginary file!",
  type: "warning",
  showCancelButton: true,
  confirmButtonColor: "#DD6B55",
  confirmButtonText: "Yes, delete it!",
  closeOnConfirm: false
},
function(){
  swal("Deleted!", "Your imaginary file has been deleted.", "success");
});

Abed Putra
fonte

1

Sim. SweeAlert é ainda mais simples que o seu exemplo, se você quiser. Acabei de criar um link de <script para a biblioteca deles e substitui a palavra "alerta" no meu código e lá estava ele! Obrigado. Recomendação doce!

JustJohn

5

Para responder às perguntas em termos de como você pediu.

Isso é realmente MUITO fácil (no Internet Explorer, pelo menos), eu fiz isso em 17,5 segundos.

Se você usar o script personalizado fornecido pelo cxfx: (coloque-o no seu arquivo apsx)

<script language="VBScript">
Sub myAlert(title, content)
MsgBox content, 0, title 
End Sub 
</script>

Você pode chamá-lo exatamente como chamou o alerta regular. Apenas modifique seu código para o seguinte.

Response.Write("<script language=JavaScript> myAlert('Message Header Here','Hi select a valid date'); </script>");

Espero que ajude você ou outra pessoa!

kralco626
fonte

2

Funciona para mim com o IE, mas não com o Firefox. Obrigado da mesma forma, rápido e sujo, mas pode ser útil.

Continente Darth

1

@ Darth. Você deve ter mencionado isso. Está usando VBScript. você precisa pesquisar no google como obter o VBScript para executar no firefox.

kralco626

2

@ Dath - PS Eu não sei se existe uma maneira de executar o VBScript no firefox. Eu criaria outro tópico chamado algo como executar este script vb no firefox e publicaria o código que forneci acima e verificaria se alguém poderia inventar alguma coisa.

kralco626

2

@ Darth - Embora eu usasse a solução de Rahul. Basta usar algum JQuery, é realmente fácil!

kralco626

3

Duas votações negativas, uma positiva ... mas não há comentários para dizer por que estou sendo votada negativa ... Acho que essa é uma solução válida ... pelo menos no IE ...: /

kralco626 26/12/12

4

Há um ótimo 'hack' aqui - https://stackoverflow.com/a/14565029 onde você usa um iframe com um src vazio para gerar a mensagem de alerta / confirmação - ele não funciona no Android (por uma questão de segurança) - mas pode se adequar ao seu cenário.

extraLRG
fonte

2

Você pode fazer um pequeno ajuste para deixar uma linha em branco no topo.

Como isso.

        <script type="text/javascript" >
            alert("USER NOTICE "  +"\n"
            +"\n"
            +"New users are not allowed to work " +"\n"
            +"with that feature.");
        </script>

webzy
fonte

1

Sim, você pode mudar isso. se você chamar a função VBscript em Javascript.

Aqui está um exemplo simples

<script>

function alert_confirm(){

      customMsgBox("This is my title","how are you?",64,0,0,0);
}

</script>


<script language="VBScript">

Function customMsgBox(tit,mess,icon,buts,defs,mode)
   butVal = icon + buts + defs + mode
   customMsgBox= MsgBox(mess,butVal,tit)
End Function

</script>

<html>

<body>
<a href="javascript:alert_confirm()">Alert</a>
</body>

</html>

Saeed
fonte

1

@ManikandanSethuraju, ele não funcionará no FF e no GC, pois eles não suportam VBScript.

atsurti

1

Quando você inicia ou apenas ingressa em um projeto baseado em aplicativos da web, o design da interface talvez seja bom. Caso contrário, isso deve ser alterado. Para aplicativos da Web 2.0, você trabalhará com conteúdo dinâmico, muitos efeitos e outras coisas. Todas essas coisas estão bem, mas ninguém pensou em criar o alerta JavaScript e confirmar as caixas. Aqui está o caminho, completamente dinâmico, orientado por JS e CSS Crie um arquivo html simples

<html>
 <head>
   <title>jsConfirmSyle</title>
   <meta http-equiv="Content-Style-Type" content="text/css" />
   <meta http-equiv="Content-Script-Type" content="text/javascript" />
    <script type="text/javascript" src="jsConfirmStyle.js"></script>
    <script type="text/javascript">

      function confirmation() {
       var answer = confirm("Wanna visit google?")
       if (answer){
       window.location = "http://www.google.com/";
       }
     }    

    </script>
    <style type="text/css">
     body {
      background-color: white;
      font-family: sans-serif;
      }
    #jsconfirm {
      border-color: #c0c0c0;
      border-width: 2px 4px 4px 2px;
      left: 0;
     margin: 0;
     padding: 0;
     position: absolute;
    top: -1000px;
    z-index: 100;
   }

  #jsconfirm table {
   background-color: #fff;
   border: 2px groove #c0c0c0;
   height: 150px;
   width: 300px;
  }

   #jsconfirmtitle {
  background-color: #B0B0B0;
  font-weight: bold;
  height: 20px;
  text-align: center;
}

 #jsconfirmbuttons {
height: 50px;
text-align: center;
 }

#jsconfirmbuttons input {
background-color: #E9E9CF;
color: #000000;
font-weight: bold;
width: 125px;
height: 33px;
padding-left: 20px;
}

#jsconfirmleft{
background-image: url(left.png);
}

#jsconfirmright{
background-image: url(right.png);
 }
 < /style>
  </head>
 <body>
<p><br />
<a href="#"
onclick="javascript:showConfirm('Please confirm','Are you really really sure to visit    google?','Yes','http://www.google.com','No','#')">JsConfirmStyled</a></p>
<p><a href="#" onclick="confirmation()">standard</a></p>

</body>
</html>

Em seguida, crie o nome simples do arquivo js jsConfirmStyle.js. Aqui está o código js simples

ie5=(document.getElementById&&document.all&&document.styleSheets)?1:0;
nn6=(document.getElementById&&!document.all)?1:0;

 xConfirmStart=800;
 yConfirmStart=100;

  if(ie5||nn6) {
  if(ie5) cs=2,th=30;
  else cs=0,th=20;
   document.write(
    "<div id='jsconfirm'>"+
        "<table>"+
            "<tr><td id='jsconfirmtitle'></td></tr>"+
            "<tr><td id='jsconfirmcontent'></td></tr>"+
            "<tr><td id='jsconfirmbuttons'>"+
                "<input id='jsconfirmleft' type='button' value='' onclick='leftJsConfirm()' onfocus='if(this.blur)this.blur()'>"+
                "&nbsp;&nbsp;"+
                "<input id='jsconfirmright' type='button' value='' onclick='rightJsConfirm()' onfocus='if(this.blur)this.blur()'>"+
            "</td></tr>"+
        "</table>"+
    "</div>"
  );
   }

 document.write("<div id='jsconfirmfade'></div>");


 function leftJsConfirm() {
  document.getElementById('jsconfirm').style.top=-1000;
  document.location.href=leftJsConfirmUri;
 }
function rightJsConfirm() {
document.getElementById('jsconfirm').style.top=-1000;
document.location.href=rightJsConfirmUri;
 }
function confirmAlternative() {
if(confirm("Scipt requieres a better browser!"))       document.location.href="http://www.mozilla.org";
}

leftJsConfirmUri = '';
rightJsConfirmUri = '';

  /**
   * Show the message/confirm box
  */
    function       showConfirm(confirmtitle,confirmcontent,confirmlefttext,confirmlefturi,confirmrighttext,con      firmrighturi)  {
document.getElementById("jsconfirmtitle").innerHTML=confirmtitle;
document.getElementById("jsconfirmcontent").innerHTML=confirmcontent;
document.getElementById("jsconfirmleft").value=confirmlefttext;
document.getElementById("jsconfirmright").value=confirmrighttext;
leftJsConfirmUri=confirmlefturi;
rightJsConfirmUri=confirmrighturi;
xConfirm=xConfirmStart, yConfirm=yConfirmStart;
if(ie5) {
    document.getElementById("jsconfirm").style.left='25%';
    document.getElementById("jsconfirm").style.top='35%';
}
else if(nn6) {
    document.getElementById("jsconfirm").style.top='25%';
    document.getElementById("jsconfirm").style.left='35%';
}
else confirmAlternative();

}

Você pode baixar o código-fonte completo aqui

Shafiqul Islam
fonte

1

u pode fazer uma Demu plz

X-Coder

0

Eu tive um problema semelhante quando queria alterar o título da caixa e o título do botão da caixa de confirmação padrão. Eu fui para o plugin de caixa de diálogo Jquery Ui http://jqueryui.com/dialog/#modal-confirmation

Quando eu tive o seguinte:

function testConfirm() {
  if (confirm("Are you sure you want to delete?")) {
    //some stuff
  }
}

Eu mudei para:

function testConfirm() {

  var $dialog = $('<div></div>')
    .html("Are you sure you want to delete?")
    .dialog({
      resizable: false,
      title: "Confirm Deletion",
      modal: true,
      buttons: {
        Cancel: function() {
          $(this).dialog("close");
        },
        "Delete": function() {
          //some stuff
          $(this).dialog("close");
        }
      }
    });

  $dialog.dialog('open');
}

Pode ser visto trabalhando aqui https://jsfiddle.net/5aua4wss/2/

Espero que ajude.

apenas eu
fonte

Como editar um título da caixa de alerta JavaScript?

Respostas: