경고 상자에 스타일 속성 추가하기

다음은 내가하려는 일에 대한 간단한 배경입니다. 내 웹 사이트에 문의 양식을 가지고 있고, 사용자가 클릭하면, 내가이 작업을 수행 할 '제출'동의 또는 동의하는 사용자를 묻는
경고 상자에 스타일 속성 추가하기

사용자가 클릭
확인 상자가 열립니다 제출 부인
동의하는 경우 = 제출 양식
에 동의하지 = 가까운 확인 상자

경우내가 알고 싶은 것은 여기있다. 실제로 가능한 경고 상자의 스타일을 지정하고 싶지는 않습니다. 그럴 수 없다는 것을 알고 있기 때문에 경고 상자 안에 텍스트의 스타일을 지정하고 싶습니다. "면책 조항". 머리글 태그와 굵은 태그를 추가하려고 시도했지만 실제 스타일이 아닌 텍스트 만 생성합니다.

사용중인 코드는 다음과 같습니다. 매우 간단한 알림 상자 스크립트입니다. 더 좋은 아이디어가 있다면 알려주세요.

<SCRIPT language="JavaScript"> 
<!-- 
function go_there() 
{ 
var where_to= confirm("DISCLAIMER TEXT WILL GO HERE"); 
if (where_to== true) 
{ 
    window.location="http://mcgehee.ace-onecomputers.com/nlphpmail.php"; 
} 
    else 
{ 

} 
} 
//-->

HTML :

<button class="button" id="submit" value="send" type="submit" name="submit" onClick="go_there()">Send</button>

또한, 나는이 함께 보내고있어 또 다른 문제는 그냥 대화 상자를 닫는 대신, 여전히 스크립트를 계속합니다.

출처

2012-11-02 Trisha

경고 상자 안에 텍스트의 스타일을 지정할 수 없습니다. 왜 모달 대화 상자를 사용하지 않습니까? Google의 경우에는 [smoke.js] (http://ssssnakes.com/smoke/)와 같이 많이 있습니다. – elclanrs

smoke.js를 사용하면 다른 경고를 추가 할 수 있습니다. 어떻게해야 링크로 갈 수 있습니까? – Trisha

@Trisha : 플러그인이 제공하는 콜백을 사용하십시오. – elclanrs

경보 또는 확인 상자의 스타일을 지정할 수 없습니다. DHTML 상자를 사용해야합니다. http://fiddle.jshell.net/muthkum/4h8cX/6/show/

사용 smoke.js 페이지의 소스를 체크 아웃, 전체 코드의 경우 http://jsfiddle.net/muthkum/4h8cX/6/

이 시도 즉석를 사용

, 나는 jQuery Impromptu 플러그인 http://trentrichardson.com/Impromptu/

데모를 사용

,210

데모 : http://jsfiddle.net/muthkum/8qXsv/3/

UPDATE : 여기

내가 jquery-1.8.2.js 및 jquery-impromptu.4.0.min.js을 포함 시켰습니다, jQuery Impromptu

당신이 볼 수있는 사용하여 전체 코드입니다. 또한 스타일은 아래 코드에 포함되어 있습니다. 이게 도움이 되길 바란다.

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
    <title> - jsFiddle demo by muthkum</title> 

    <script type='text/javascript' src='http://code.jquery.com/jquery-1.8.2.js'></script>  

     <script type='text/javascript' src="http://trentrichardson.com/Impromptu/scripts/jquery-impromptu.4.0.min.js"></script> 


    <style type='text/css'> 
    /* 
------------------------------ 
    Impromptu 
------------------------------ 
*/ 
.jqifade{ 
    position: absolute; 
    background-color: #777777; 
} 
div.jqi{ 
    width: 400px; 
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; 
    position: absolute; 
    background-color: #ffffff; 
    font-size: 11px; 
    text-align: left; 
    border: solid 1px #eeeeee; 
    border-radius: 10px; 
    -moz-border-radius: 10px; 
    -webkit-border-radius: 10px; 
    padding: 7px; 
} 
div.jqi .jqicontainer{ 
    font-weight: bold; 
} 
div.jqi .jqiclose{ 
    position: absolute; 
    top: 4px; right: -2px; 
    width: 18px; 
    cursor: default; 
    color: #bbbbbb; 
    font-weight: bold; 
} 
div.jqi .jqimessage{ 
    padding: 10px; 
    line-height: 20px; 
    color: #444444; 
} 
div.jqi .jqibuttons{ 
    text-align: right; 
    padding: 5px 0 5px 0; 
    border: solid 1px #eeeeee; 
    background-color: #f4f4f4; 
} 
div.jqi button{ 
    padding: 3px 10px; 
    margin: 0 10px; 
    background-color: #2F6073; 
    border: solid 1px #f4f4f4; 
    color: #ffffff; 
    font-weight: bold; 
    font-size: 12px; 
} 
div.jqi button:hover{ 
    background-color: #728A8C; 
} 
div.jqi button.jqidefaultbutton{ 
    background-color: #BF5E26; 
} 
.jqiwarning .jqi .jqibuttons{ 
    background-color: #BF5E26; 
} 


    </style> 



<script type='text/javascript'>//<![CDATA[ 

function go_there(){ 

    $.prompt('<b>DISCLAIMER</b> <span style="font-weight:normal">TEXT WILL GO HERE</span>',{ 
     buttons: { Ok: true, Cancel: false}, 
     callback: function(e,v,m,f){ 
      if(v){ 
      window.location="http://mcgehee.ace-onecomputers.com/nlphpmail.php"; 
      }else{ 

      } 
     } 
    }); 

} 

//]]> 

</script> 


</head> 
<body> 
    <button class="button" id="submit" value="send" type="submit" name="submit" onClick="go_there()">Send</button> 


</body> 


</html>

출처

2012-11-02 05:38:45

@elclanrs : 내가 뭘 잘못했는지는 모르겠지만 지금은 대화 상자를 생성하지 않습니다. 사이트로 연결되는 링크는 mcgehee.ace-onecomputers.com입니다. 나는 smoke.js 'smoke.confirm'과 Muthu가 제안한 방법을 모두 시도했다. – Trisha

http://jsfiddle.net에 코드를 입력하여 공유 할 수 있습니까? 내가 너를 도울 수 있도록. –

[http://jsfiddle.net/nU2xp/](http://jsfiddle.net/nU2xp/) – Trisha

경고 상자에 스타일 속성 추가하기

답변

관련 문제