从输入值更新自定义属性显示未定义

Question

这个 post 和我有类似的问题。但是，它对我的情况没有帮助。

我有一个允许用户粘贴或输入 url 的文本框。当点击分享按钮时，它将在文本框上分享 url。

<div class="sharewrapurl">
    <div id="shareurl_validation" style="display: none"> </div>
    <input type="text" id="shareviaurl_url" class="textbox_with_url" name="shareviaurl_url" placeholder="Paste URL here.">
    <div class="shareurlbutton">
        <span id="fb_ut_urlshare" style="width:100px;"><span class="st_facebook_large" st_url="http://santosh-shah.com" st_title="#DVDNation #ad #DVD20" onclick="social_share_url(appConfig.FacebookPostWidgetConfigId)"></span></span>
        <span id="tw_ut_urlshare" style="width:100px;"><span class="st_twitter_large" st_url="s" st_title="#DVDNation #ad #DVD20" onclick="social_share_url(appConfig.TwitterPostWidgetConfigId)"></span></span>
    </div>
    <!-- /.shareurlbutton -->
</div>

如果我直接点击 facebook 分享，它会分享我在 st_url 中的域名，但我想用输入框值更新该属性。

$('#shareviaurl_url').on('input propertychange paste', function() {
    var url = $("#shareviaurl_url").val();
    $("#shareurlbutton").find("#st_facebook_large").attr("st_url",url);
    console.log($("#shareurlbutton").find("#st_facebook_large").attr("st_url"));//returns undefined.
});

Answer 1

您使用的是 ID 选择器 (#) 而不是 class 选择器 (.)。这是工作版本：

$('#shareviaurl_url').on('input propertychange paste', function() {
    var url = $('#shareviaurl_url').val();
    $('.shareurlbutton').find('.st_facebook_large').attr('st_url', url);
    console.log($('.shareurlbutton').find('.st_facebook_large').attr('st_url'));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="sharewrapurl">
    <div id="shareurl_validation" style="display: none"> </div>
    <input type="text" id="shareviaurl_url" class="textbox_with_url" name="shareviaurl_url" placeholder="Paste URL here.">
    <div class="shareurlbutton">
        <span id="fb_ut_urlshare" style="width:100px;"><span class="st_facebook_large" st_url="http://santosh-shah.com" st_title="#DVDNation #ad #DVD20" onclick="social_share_url(appConfig.FacebookPostWidgetConfigId)"></span></span>
        <span id="tw_ut_urlshare" style="width:100px;"><span class="st_twitter_large" st_url="s" st_title="#DVDNation #ad #DVD20" onclick="social_share_url(appConfig.TwitterPostWidgetConfigId)"></span></span>
    </div>
</div>

干杯。 :)

从输入值更新自定义属性显示未定义

Update custom attribute from input value shows undefined

javascript

jquery

facebook-sharer