Bas*_*ect 4 jquery refactoring dry
有没有办法干掉这个jQuery?
<script type="text/javascript">
$('form input#search').watermark('search...');
</script>
<script type="text/javascript">
$('form input#post_title').watermark('title');
</script>
<script type="text/javascript">
$('form input#post_tag_list').watermark('tag (separate tags with a comma)');
</script>
<script type="text/javascript">
$('form input#post_name').watermark('name (optional)');
</script>
<script type="text/javascript">
$('form input#post_email').watermark('email (optional)');
</script>
<script type="text/javascript">
$('form textarea#post_content').watermark('message');
</script>
<script type="text/javascript">
$('form input#comment_commenter').watermark('name (optional)');
</script>
<script type="text/javascript">
$('form input#comment_email').watermark('email (optional)');
</script>
<script type="text/javascript">
$('form textarea#comment_body').watermark('reply');
</script>
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery("abbr.timeago").timeago();
});
</script>
Run Code Online (Sandbox Code Playgroud)
它看起来非常重复.
编辑:我在所有表单中添加了占位符元素.我的应用程序是HTML5,所以没关系.我用过这段代码:
<script type="text/javascript">
jQuery(function(){
jQuery("abbr.timeago").timeago();
jQuery('form input, form textarea').each(
function(){
jThis = jQuery(this);
jThis.watermark(jThis.attr('placeholder'));
}
}
);
</script>
Run Code Online (Sandbox Code Playgroud)
Chrome使用或不使用JS渲染占位符,而FF 3.6.8和Opera 10.61显示空输入/ textarea框.我应该使用$而不是jQuery(function(){...?或者重要吗?
注意:我正在使用jQuery 1.4.2
如果你在标题属性中存储了水印函数的参数,那么你可以有这样的东西;
<form>
<input type="text" id="search" title="search..." />
<input type="text" id="post_title" title="title" />
<input type="text" id="post_tag_list" title="tag (separate tags with a comma)" />
<input type="text" id="post_name" title="name (optional)" />
<input type="text" id="post_email" title="email (optional)" />
<input type="text" id="post_content" title="message" />
<input type="text" id="comment_commenter" title="name (optional)" />
<input type="text" id="comment_email" title="email (optional)" />
<input type="text" id="comment_body" title="reply" />
</form>
<script type="text/javascript">
jQuery(function(){
jQuery("abbr.timeago").timeago();
jQuery('form input, form textarea').each(
function(){
jThis = jQuery(this);
jThis.watermark(jThis.attr('title'));
}
}
);
</script>
Run Code Online (Sandbox Code Playgroud)