JS_javascript 기술의 artdialog 팝업 상자 제어 제출 양식 아이디어에 대한 자세한 설명

artDialog는 자바스크립트를 기반으로 작성된 대화상자 컴포넌트로, 정교한 인터페이스와 친숙한 인터페이스를 가지고 있습니다.

머리말:

적응형 콘텐츠

artDialog의 특별한 UI 프레임워크는 콘텐츠 변경에 적응할 수 있으며 외부 프로그램에 의해 동적으로 삽입된 콘텐츠에도 적응할 수 있으므로 사용하기 위해 메시지 콘텐츠 크기를 고려할 필요가 없습니다. 메시지 컨테이너는 너비를 기준으로 텍스트를 중앙에 배치하거나 왼쪽으로 정렬할 수도 있습니다. 모두 기본적으로 XHTML+CSS로 구현됩니다.

완벽한 인터페이스

완벽한 인터페이스를 갖추고 있으며 외부 프로그램과도 쉽게 사용할 수 있습니다. 비동기식 메시지 작성, 위치, 크기 제어, 표시 및 숨기기, 닫기 등

자세한 경험

입력 상태가 아닌 경우 Esc 단축키를 지원하여 요소 근처에 팝업되도록 지정하여 버튼에 초점을 수직으로 추가할 수 있습니다. 중앙에 위치하며, 반응 속도가 빠른 iPad와 같은 터치 스크린 장치에 특별히 최적화되어 있습니다.

크로스 플랫폼 호환

호환 가능: IE6+, Firefox, Chrome, Safari, Opera, iPad 및 기타 모바일 장치. 또한 IE6은 최신 브라우저의 정적 위치 지정(고정), 오버레이 드롭다운 컨트롤 및 알파 채널 png 배경도 지원할 수 있습니다.

요점:

artdialog는 좋은 팝업 상자 컨트롤입니다

저는 ArtDialog를 한동안 접해왔는데, 사용하기에도 꽤 좋고, 비교적 가벼운 편이라고 생각합니다. 저는 가볍고 로딩 속도가 빠른 자바스크립트 플러그인을 선호합니다.

기능도 매우 훌륭하고 완벽합니다. 다른 팝업 플러그인에 비해 이 플러그인은 아직 유지 관리 중일 뿐만 아니라 버그도 적고 사용하기 매우 편리한 플러그인 중 하나입니다. 중국에서 더욱 뛰어난 플러그인을 만나보세요.

호출 방법은 다음과 같습니다.

//说明下面是一段通过artdialog弹出form表单，并通过ajaxform来提交的js（表单可以采用jquery validate验证控件来验证表单）
$(document).ready(function() {
var options = {
target: '#output2',
success: showResponse // post-submit callback
};
$('#myForm').ajaxForm(options);
var alt =null;
$("#addHname").click(function(){
alt=art.dialog({
title:'新增花名',
content: document.getElementById('g_cn'),
width:750,
button: [
{
name: '保存',
focus: true,
callback: function () {
$('#myForm').submit();
return false;
}
},
{
name: '关闭',
callback: function () {
}
}
]
});
});
function showResponse(data){
if(alt !=null){
alt.close();
}
if(data=='success'){
artDialog.alert('保存成功');
}else{
art.dialog.close();
artDialog.alert('保存失败');
}
}
});

위는 편집자가 소개한 JS의 artdialog 팝업 상자 컨트롤의 제출 양식 아이디어에 대한 자세한 설명입니다.